webpack-dev-server

可以模拟线上环境进行项目调试的工具

主要常用的功能

• 路径重定向
• 浏览器中显示编译错误
• 接口代理
• 热更新

常用配置：

• inline: 服务的开启模式
• lazy: 懒编译
• prot: 代理端口
• overlay: 错误遮罩
• historyApiFallback: 路径重定向
• proxy: 代理请求(主要用来解决跨域问题)
• hot: 热更新(hot，hotOnly)(会和 extract-text-webpack-plugin 产生冲突)

{
  devServer: {
    proxy: {
      '/': {
        target: 'xxxx',
        changeOrigin: true,
        pathRewrite: {
          '^/comments': '/api/comments',
        },
        headers:  {

        }
      }
    }
  }
}

source-map

可以将代码对应到源文件的位置

模式：

• eval
• eval-source-map
• cheap-eval-source-map
• cheap-module-source-map
• source-map
• hidden-source-map
• nosource-source-map

{
  devtool: "eval-source-map";
}