Understanding Redux DevToolsHMR
Our starter kit is already configured with HMR plugin to facilitate development. You can read more about it at https://webpack.js.org/guides/hot-module-replacement/.
Replacing the hot module
This is one of the most useful features provided by webpack. Although our project is already configured and enabled with this feature, in this section we are going to walk through it. We are using webpack-hot-middleware
as it allows us to add hot reloading into an existing server (https://github.com/webpack-contrib/webpack-hot-middleware). To configure it, follow these steps:
- Install the
npm
module:
yarn add webpack-hot-middleware --dev --exact or npm install --save-dev webpack-hot-middleware
- Enable hot reloading in the webpack configuration file. If you check the
webpack/webpack.dev.babel.js
file, you will see the configuration inside theplugins
array:
plugins: [
new webpack.HotModuleReplacementPlugin(),
new HtmlWebpackPlugin({
inject: true,
template: 'app/index...