README.md

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 path = require('path');
const files = fs
  .readFileSync('./renderReactRoots.txt', 'utf8')
  .split('\n')
  .map(p => path.resolve(p);

module.exports = {
  ...
  module: {
    rules: [
        // Hot Export React Root Components
        {
            test: /*.js$/,
            exclude: /node_modules/,
            use: {
                loader: 'babel-loader',
                options: {
                    babelrc: true,
                    plugins: [
                      ['hot-export', { files }]
                    ],
                },
            },
        },
        ... // all your standard rules
    ],
  }
  ...
};