vue.config.js 里配置 Terser 压缩插件，主要作用是在生产环境中移除调试代码和压缩 JavaScript。

原创于 2025-12-25 17:59:17 发布 · 97 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #前端

// vue.config.js
module.exports = {
  chainWebpack: config => {
    // 只在生产环境配置
    config.when(process.env.NODE_ENV === 'production', config => {
      // Terser 压缩配置
      config.optimization.minimizer('terser').tap(args => {
        args[0].terserOptions = {
          compress: {
            drop_console: process.env.NODE_ENV === 'production',
            drop_debugger: true,
            pure_funcs: process.env.NODE_ENV === 'production' 
              ? ['console.log', 'console.info', 'console.debug'] 
              : [],
            // 高级优化
            dead_code: true,
            unused: true,
            reduce_vars: true,
            conditionals: true,
            booleans: true,
            if_return: true,
            join_vars: true,
            collapse_vars: true
          },
          mangle: {
            safari10: true
          },
          output: {
            comments: false,
            ascii_only: true
          }
        }
        args[0].parallel = true
        args[0].extractComments = false
        return args
      })
    })
  }
}