webpack-dev-server实现热部署

1. npm install —save-dev webpack-dev-server

devserver的配置选项 功能描述
contentBase 默认webpack-dev-server 会为根文件夹提供本地服务器，如果想为另一个目录下的文件提供本地服务器，应该在这里设置其所在目录
port 设置默认监听端口。如果省略，默认为“8080”
inline 设置为true，当源文件改变时会自动刷新页面
historyApiFallback 在开发单页应用时非常有用，它依赖于HTML5 history API，如果设置为true，所有的跳转将指向index.html 
  1. module.exports = {
  2.   entry:  __dirname + "/app/main.js",
  3.   output: {
  4.     path: __dirname + "/public",
  5.     filename: "bundle.js"
  6.   },
  8.   devServer: {
  9.     contentBase: "./public",//本地服务器所加载的页面所在的目录
  10.     historyApiFallback: true,//不跳转
  11.     inline: true//实时刷新
  12.   } 
  13. }

2. 在package.json中配置webpack-dev-server

  1. "scripts": {
  2.     "test": "echo \"Error: no test specified\" && exit 1",
  3.     "start": "webpack",
  4.     "server": "webpack-dev-server --open"
  5.   },

3. npm run server 启动