webpack-dev-server(自动刷新页面)

一.最简配置
<1>package.json文件:
scripts的属性值增加-- "dev": "webpack-dev-server",
<2>webpack.config.js文件:
引入模块--
const HtmlWebpackPlugin = require("html-webpack-plugin");
plugins新增插件--
new HtmlWebpackPlugin({
template: './index.html'
})
通过以上配置, 命令行输入 npm run dev, 打开 localhost:8080即可, 接下来只要更改文件内容并保存浏览器就会自动刷新. 当然以上前提是引入devServer包(npm install --save-dev webpack-dev-server).

webpack-dev-server是一个小型的Node.js Express服务器,它使用webpack-dev-middleware来服务于webpack的包,除此自外，它还有一个通过Sock.js来连接到服务器的微型运行时.webpack-dev-server是一个小型的Node.js Express服务器,它使用webpack-dev-middleware来服务于webpack的包, webpack-dev-server默认会以当前目录为基本目录. webpack-dev-server生成的包并没有放在你的真实目录中,而是放在了内存中. HtmlWebpackPlugin--生成html文件, 上述配置的意思是通过模板 index.html文件生成一个自动引用bundle.js文件的index.html文件, 该文件和webpack-dev-server生成的包一样存在于内存.