vue cli3 優化配置生產去除console.log - from UglifyJs `warnings` is not a supported optio

使用 vue cli 3.x 配置生產去除 console.log 時出現了報錯，以下，

1. 寫法一：

// vue.config.js

module.exports = {
    optimization: {
      minimizer: [
        new UglifyJsPlugin({
          uglifyOptions: {
            compress: {
              warnings: false,
              drop_console: true,//console
              drop_debugger: false,
              pure_funcs: ['console.log']//移除console
            }
          }
        })
      ]
    }
 }
複製代碼

出現報錯 UglifyJs DefaultsError: warnings is not a supported option

2. 寫法二：

// vue.config.js

module.exports = {
  configureWebpack: config => {
    if (process.env.NODE_ENV === 'production') {
      config.plugins.push(
        new UglifyJsPlugin({
          uglifyOptions: {
            compress: {
              warnings: false,
              drop_debugger: true, // console
              drop_console: true,
              pure_funcs:['console.log'] // 移除console
            },
          },
          sourceMap: false,
          parallel: true,
        })
      )
    }
  },
}
複製代碼

出現報錯 warnings is not a supported option

可見使用 uglifyjs-webpack-plugin 在這裏沒法實現去除控制檯的信息。

使用 terser-webpack-plugin 代替，實現生產去除 console.log

// vue.config.js

module.exports = {
  configureWebpack: {
    optimization: {
      minimizer: [
        new TerserPlugin({
          terserOptions: {
            ecma: undefined,
            warnings: false,
            parse: {},
            compress: {
              drop_console: true,
              drop_debugger: false,
              pure_funcs: ['console.log'] // 移除console
            }
          },
        }),
      ]
    }
  },
}
複製代碼