Terser插件不在Vue构建上使用vue CLI 5运行

Question

我正在尝试用下面的configureWebpack创建一个生产构建，但是Terser在构建过程中不会运行。

代码不会最小化或被丑化。我也尝试过hidden-source-map

使用"terser-webpack-plugin": "^5.3.3"和@vue/cli@5.0.7

isProd被正确地设置为true。

const TerserPlugin = require('terser-webpack-plugin');
const isProd = process.env.NODE_ENV === 'production';

module.exports = {
    publicPath: '/',
    devServer: {
        host: 'staging-beta.myDomain.com',
        port: 9000,
        allowedHosts: 'all',
    },
    transpileDependencies: ['vuetify'],
    chainWebpack: (config) => {
        // reducted code
    },
    configureWebpack: {
        devtool: 'source-map',
        optimization: {
            minimize: isProd,
            minimizer: isProd
                ? [
                      new TerserPlugin({
                          minify: TerserPlugin.uglifyJsMinify,
                          terserOptions: {
                              compress: {
                                  drop_console: true,
                              },
                              output: {
                                  comments: false,
                              },
                          },
                      }),
                  ]
                : [],
        },
    },
};

Answer 1

正确的设置是：

module.exports = defineConfig({
    terser: {
        minify: 'uglifyJs',
        terserOptions: {
            compress: {
                drop_console: true,
            },
        },
    },
})

你还需要npm install uglify-js

不推荐输出项下的comments。