webpack 其他常见配置设置

1、mode 配置项

• a、当 mode 的值为 production 时，打包文件将会被压缩
• b、当 mode 的值为 development 时，打包文件不会被压缩webpack 其他常见配置设置

2、sourceMap 配置项

{
  /**
   * development 打包的代码不被压缩
   * production 打包的代码会被压缩
   */
  mode: 'development',
  /**
   * sourceMap 是一个映射关系
   * 可以将打包后文件出错时，映射到开发时的具体出错文件
   * 一般使用时会产生 .map 文件，在正式环境不想生成时，可配置为 none
   * 推荐配置
   *   1、开发环境 devtool: 'cheap-module-eval-source-map'
   *   2、生产环境 devtool: 'cheap-module-source-map'
   *   3、不想生成 .map 文件时，可将 devtool 配置为 none
   */
  // eval 会将 .map 文件写入打包文件中
  devtool: 'cheap-module-source-map', 
}

3、设置业务代码能访问到的全局变量

{
  plugins: [
    new webpack.DefinePlugin({
      new webpack.DefinePlugin({
      // 字符串
      ENV: "'env'",
      // 对象
      OBJECT: JSON.stringify({ demo: 'demo' })
    })
  ]
}

// 在业务代码中访问
console.log(ENV)
console.log(OBJECT)