Webpack：搭建本地服务器

1. 概述

webpack提供了一个可选的基于node.js的本地开发服务器，内部使用了express框架，可以实现我们想要让浏览器自动刷新显示我们修改后的结果。

2. 安装

因为它是一个单独的模块，需要安装

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

3. 配置

  devServer: {
    contentBase: './dist',
    inline: true
  }

contentBase：为哪一个文件夹提供本地服务器，默认根文件夹
inline：页面实时刷新
port：我们还可以指定端口号，不写默认8080
historyApiFallback：在SPA页面中，依赖HTML5的history模式

4. 运行

一种是直接输入文件的相对地址（不推荐）

推荐在webpack.config.js中配置脚本：

  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack",
    "dev": "webpack-dev-server --open"
  },

然后通过 npm run dev 即可运行，这里 --open是表示运行后自动打开网页