webpack03 模块热重载（hot-reload）

安装webpack-dev-server

npm install webpack-dev-server --save-dev

在webpack.config.js中进行配置

devServer: {
  contentBase: path.resolve(__dirname, 'dist'),
  host: 'localhost',
  compress: true,
  port: 1608
}

• contentBase：服务器基本运行路径
• host：服务器运行地址
• compress：服务器压缩式，一般为true
• port：服务运行端口

在package.json中定义相关命令：

"scripts": {
  "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
},

然后执行

npm run dev

就可以开启webpack的服务，并且实现模块热重载

增加--open属性可以自动打开浏览器。

参考

• https://github.com/webpack/webpack-dev-server
• https://doc.webpack-china.org/guides/hot-module-replacement/