react-hot-loader 's direct dependencies. Data on all dependencies, including transitive ones, is available via CSV download.| Name | Version | Size | License | Type | Vulnerabilities |
|---|---|---|---|---|---|
| fast-levenshtein | 2.0.6 | 3.61 kB | MIT | prod | |
| global | 4.4.0 | 1.85 kB | MIT | prod | |
| hoist-non-react-statics | 2.5.5 | 3.73 kB | BSD-3-Clause | prod | |
| prop-types | 15.8.1 | 22.12 kB | MIT | prod | |
| react-lifecycles-compat | 3.0.4 | 5.86 kB | MIT | prod | |
| react | 16.14.0 | 59.16 kB | MIT | prod peer | 1 |
| shallowequal | 1.1.0 | 2.99 kB | MIT | prod |
React Hot Loader is a plugin that allows you to tweak React components in real time and see the changes without having to reload your application. This capability greatly enhances the development workflow, making it easier and faster to iterate through changes, visualize results, and debug code.
To utilize React Hot Loader, first, install it in your project using npm with the command:
npm install react-hot-loader
Once it is installed in your project, there are several steps to follow:
react-hot-loader/babel to your .babelrc file:// .babelrc
{
"plugins": ["react-hot-loader/babel"]
}
// App.js
import { hot } from 'react-hot-loader/root';
const App = () => <div>Hello World!</div>;
export default hot(App);
react-hot-loader before react and react-dom. You can do this in your main file (preferably before React) or prepend your webpack entry point with react-hot-loader/patch:// webpack.config.js
module.exports = {
entry: ['react-hot-loader/patch', './src'],
// ...
};
@hot-loader/react-dom.The React Hot Loader documentation is available on GitHub and can be accessed via the URL: git+https://github.com/gaearon/react-hot-loader.git. There, issues can be reported, and you can navigate through the different sections ranging from installation, example usage to setting up with various environments, API references, and known limitations.
