HMR：当修改一个js或者css的时候，只刷新修改的内容，不进行整个页面的刷新。
css的HMR——只支持开发环境
不能使用mini-css-extract-plugin需要使用style-loader,因为它不支持抽离出的css,需要用style-loader
① 在webpack.config.js中配置 （需要webpack-dev-server配合）
//头部引入webpack
const webpack = require("webpack");
//****
//****
//****
//****
devServer: {
hot: true,
},
//****
//****
//****
//****
//插件配置出添加
plugins: [
new htmlWebpackPlugin({
template: "./src/index.html",
filename: "index.html",
chunks: ["main"],
}),
new CleanWebpackPlugin(),
// new miniCssExtractPlugin({
// filename: "css/index-[contenthash:6].css",
// }),
// new txtWebpackPlugin({ name: "老韩" }),
new fileWebpackPlugin(),
new webpack.HotModuleReplacementPlugin(), //webpack自带插件
],
②运行
package.json中
"scripts": {
"server": "webpack-dev-server "
},npm run server
js的HMR
vue 使用vue-loader
