Question

我有Webpack的 4.23.1 版本，并使用TerserWebpackPlugin缩小了我的项目。我想将console.log放到生产环境中，但是不起作用。我没有尝试过UglifyJsplugin。

这是我的 webpack.config.js 文件：

var path = require('path')
var webpack = require('webpack')
const bundleOutputDir = './wwwroot/dist';
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const configs = require('./wwwroot/js/config')
const TerserPlugin = require('terser-webpack-plugin');

module.exports = {
  mode: 'production',
  optimization:{
    minimizer:[
      new TerserPlugin({
        terserOptions:{
          cache: true,
          parallel: true,
          sourceMap: false,
          compress:{
            drop_console: true,          
          }           
        }
      })
    ]
  },
  context: __dirname,
  entry: {
    main: ['babel-polyfill', './App/index.js']
  },
  plugins:[
    new VueLoaderPlugin(),
    new webpack.DefinePlugin({
      'SERVICE_URL': JSON.stringify(configs.url),
    }),        
  ],
  module: {
    rules: [...]
  },
  resolve: {...},
  devServer: {
    historyApiFallback: true,
    noInfo: false,
    overlay: true
  },
  performance: {
    hints: false
  },
  output: {
    path: path.join(__dirname, bundleOutputDir),
    filename: '[name].js',
    publicPath: 'dist/'
  },
  devtool: '#eval-source-map'
}

Answer 1

好问题，因为这并不像看起来那么琐碎！我以前曾经遇到过类似的问题，即使控制台使用的配置与您的类似，控制台仍然存在。考虑到您的配置，我想说它应该输出正确的non-console.logs输出！为什么会失败？ ID'建议调查以下线程https://github.com/webpack-contrib/terser-webpack-plugin/issues/57

以下答案使用以下程序包：

webpack 4.41.6
terser-webpack-plugin 2.3.5

我的回答遵循原始terser插件中记录的压缩选项，该压缩选项可在URL https://github.com/terser/terser中找到

为简单起见，假设有一个基本配置文件，该文件沿答案合并，不会影响输出。因此，这是一个有效的示例：

const merge = require('webpack-merge')
const webpackCommonConfig = require('./webpack.common.js')
const TerserPlugin = require('terser-webpack-plugin')

module.exports = merge(webpackCommonConfig, {
  mode: 'production',
  optimization: {
    minimizer: [
      new TerserPlugin({
        terserOptions: {
           compress: {
               drop_console: true
           }
          }
      })
    ]
  }
})

使用TerserWebpackPlugin删除console.log

1 个答案: