babel-plugin-hot-export
v1.0.0
Published
Wrap default export with react-hot-loader
Downloads
5
Readme
babel-plugin-hot-export
Babel plugin to wrap default export with react-hot-loader
...
export default thing;
will be transformed to
import { hot } from 'react-hot-loader';
...
export default hot(module)(thing);
This can be useful when multiple "root" react components are rendered in the process of converting a legacy app into react.
A list of absolute paths to such "root" components can be generated by grep or similar tools and stored into a file.
Then you can prepend your exising webpack rules with one that will check if a module is your "root" component and should be hot-exported.
// webpack.dev.config
const reactRenderRoots = fs.readFileSync('./renderReactRoots.txt', 'utf8').split('\n');
module.exports = {
...
module: {
rules: [
// Hot Export React Root Components
{
test(module) {
return reactRenderRoots.includes(module);
},
use: {
loader: 'babel-loader',
options: {
babelrc: false,
plugins: ['hot-export'],
},
},
},
... // all your standard rules
],
}
...
};