10天掌握webpack 4.0 服务篇

npm i webpack-dev-server –D

安装插件

 在 webpack.config.js 添加配置

• contentBase 配置开发服务运行时的文件根目录
• host：开发服务器监听的主机地址
• compress 开发服务器是否启动gzip等压缩
• port：开发服务器监听的端口

  devServer: {
    //配置开发服务运行时的文件根目录
    contentBase: path.join(__dirname, 'dist'),
    //开发服务器监听的端口
    port: 9000,
    //开发服务器是否启动gzip等压缩
    compress: true,
    host: 'localhost'
  },

添加运行脚本

package.json

  "scripts": {
    "build": "webpack",
    "dev": "webpack-dev-server --open"
  }

启动：