output 属性

output 里包含两个配置路径，path 和 publicPath，path 指定打包输出的目录， publicPath 指定index.html内部的引用路径。

output: {
    filename: 'js/main.js',
    path: path.resolve(__dirname, 'dist'), // 输出到根目录的 dist 目录下
    publicPath: './'   // 相对路径，使用这种配置 webpack-dev-server 会报错
      // publicPath: '/'   // 绝对路径，使用这种配置 build 后打开 index.html 会报错
  },

devServer 属性

devServer 里包含两个配置路径，publicPath 和 contentBase，publicPath 指定 dev-server 启动的目录，实际上磁盘上并没有这个目录，contentBase 指定不需要经过打包的资源的路径。

devServer: {
      publicPath: '/lg' // 启动后需要在端口后加上 '/lg' 才能访问
    contentBase: ['./public'], // 直接拷贝 public 下的资源
  },

两个 publicPath 的关系

两个 publicPath 最好设置成一致，否则会出现资源找不到的情况。