Webpack React-hot-loader Not Working

Below is my webpack.config.js code var webpack = require('webpack'); var path = require('path'); module.exports = { // context: __dirname + '/app', entry: [ 'webpack-d

Solution 1:

I made it work using the solution found here. Basically what needs to be done is add module.hot.accept() to the script where you render your component to.

For example:

import React from 'react';
import ReactDOM from 'react-dom';
import MainLayout from './components/MainLayout.jsx';

ReactDOM.render(
  <MainLayout />,
  document.getElementById('root')
);

module.hot.accept(); // <-- this one.

Solution 2:

Refer to react-hot-boilerplate github and check .babelrc file in the github.

Maybe I don't, also check include, query, 0.0.0.0 in your settings.

Remember, as per your babel version(5 or 6), settings have to be different.

And now react-hot-loader is deprecation. Refer to react-hot-loader github.

Solution 3:

By default react js provides hot reloading feature. Still if it's not working:

Try adding -- --reset-cache to your run command. *for Linux OS

Ref: React js hot reload issue fix for Linux OS

Duplicate issue in github