webpack教程(三)——热刷新

现在我们如果修改代码，需要重新打包，再一次在命令行下输入webpack命令，很麻烦。

热刷新是什么呢？就是我们该完代码保存之后webpack会自动打包引起浏览器自动刷新，你只需要把精力都专注在代码研发上不需要再分散精力在打包上。节省了时间和精力，效率更高了。

怎么做呢？

首先安装

cpm intall webpack-dev-server --save-dev

 

打开package.json文件。

打开命令行，运行npm run start 

打开浏览器 转到http://localhost:8080

当我们修改代码保存的时候，浏览器会直接刷新

如果我们的8080端口被占用，想在其他端口打开怎么办？

在webpack.config.js中添加如下代码

打开浏览器，端口号改为9000

 

已经成功的在9000端口上运行。

更多关于dev-server的细节去https://webpack.js.org/configuration/dev-server查看。