reactjs - 使用 Webpack 和 Uglify 删除 console.logs

Question

我正在尝试使用 Webpack 的 Uglify 插件删除 console.logs 但似乎与 Webpack 捆绑在一起的 Uglify 插件没有该选项，文档中未提及。

我正在从 webpack 初始化 uglify，如下所示:

new webpack.optimize.UglifyJsPlugin()

我的理解是我可以使用独立的 Uglify lib 来获取所有选项，但我不知道是哪一个？

问题是 drop_console 不起作用。

Answer 1

使用UglifyJsPlugin，我们可以处理评论、警告、控制台日志，但在开发模式下删除所有这些并不是一个好主意。首先检查您是否正在为 prod env 或 dev env 运行 webpack，如果是 prod env 那么您可以删除所有这些，如下所示:

var debug = process.env.NODE_ENV !== "production";

plugins: !debug ? [
   new webpack.optimize.UglifyJsPlugin({

     // Eliminate comments
        comments: false,

    // Compression specific options
       compress: {
         // remove warnings
            warnings: false,

         // Drop console statements
            drop_console: true
       },
    })
]
: []

引用:https://github.com/mishoo/UglifyJS2#compressor-options

2019 年更新现在需要使用 terser 插件来支持 webpack v4 中的 ES6 https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions

webpack.config.js

module.exports = {
  optimization: {
    minimize: true,
    minimizer: [
      new TerserPlugin({
        sourceMap: true, // Must be set to true if using source-maps in production
        terserOptions: {
          compress: {
            drop_console: true,
          },
        },
      }),
    ],
  },
};