webpack5中的HMR热更新功能

从 webpack-dev-server v4.0.0 开始，热模块替换是默认开启的。

1.css样式：

借助于 style-loader，使用模块热替换来加载 CSS 实际上极其简单。此 loader 在幕后使用了 module.hot.accept。

module: {
     rules: [
       {
         test: /\.css$/,
         use: ['style-loader', 'css-loader'],
       },
     ],
   },

2.html样式：

默认不能使用HMR功能，在入口文件引入html文件即可。

3.js文件:

在入口文件删掉print.js；修改 index.js 文件，以便当 print.js 内部发生变更时可以告诉 webpack 接受更新的模块。

在index.js中添加以下代码：

 if (module.hot) {
   module.hot.accept('./print.js', function() {
     console.log('Accepting the updated printMe module!');
     printMe();
   })
 }