3 配置webpack-server（实时更新）

3-1 配置

cnpm i webpack-dev-server -S
yarn add webpack-dev-server

3-2 webpack.config.js

// webpack.config.js
const config ={
    ...
    devServer:{
        contentBase:"./dist",
        port:8000,         
        host:"localhost",   // 设置主地址
    },
  devServer:{
        static:{
            directory:path.join(__dirname,'public'),
        },
        port:8080,           // 设置端口号
        compress:true,
            client:{
          overlay:true          // 将报错显示在页面上
            }
    },
}

3-3 配置package.json

"scripts": {
    ...
    "dev": "webpack-dev-server",          --cnpm
      //"serve": "webpack server --open"  --yarn
  }

3-4 执行脚本

npm run dev
//yarn serve

tip:webpack-server不会真实生成文件夹会把打包生成的文件放在内存里面

3-5 实现错误追踪

const config =  {
  ...
    devtool: 'inline-source-map'  //错误追踪
  ...
}
module.exports = config;