A JSX transformer with extra hints around interpolations and outer templates
npm install @ungap/babel-plugin-transform-hinted-jsxThis plugin is a follow up of this post and it can be used in place of @babel/plugin-transform-react-jsx.
A huge thanks to Nicolò Ribaudo for helping out.
``json`
{
"plugins": [
["@ungap/babel-plugin-transform-hinted-jsx"]
]
}
`sh`
npm i --save-dev @babel/cli
npm i --save-dev @babel/core
npm i --save-dev @ungap/plugin-transform-hinted-jsx
This produces a slightly different JSX transform.
` js
const div = (
{
);
// becomes
var _token = {},
_token2 = {};
const div = React.createElement(
"div",
{__token: _token},
React.createElement(
"p",
{
className: "static",
runtime: React.interpolation('prop')
}
),
React.interpolation(
React.createElement(
"p",
{__token: _token2}
)
)
);
`
`js``
/* @jsx your.createElement /
/* @jsxFrag your.Fragment /
/* @jsxInterpolation your.interpolation /