nuxt2 服务端配置terser配置无效问题
2025-03-06 nuxtjs nuxt2 349 字 1 分钟
背景
生产环境服务端会打印大量的调试用的 log, 一部分是影响排查问题的, 另一部分是影响性能的, 所以需要将这些 log 给去掉, 之前一直以为是开发人员没有配置 terser导致的。最近正好在定位 nodejs内存泄露问题,就想着一起解决一下。
但是发现nuxt.config.js
中已经配置了terser
配置,但是还是没有生效。
build: {
terser: {
extractComments: false,
terserOptions: {
compress: {
drop_console: true,
},
},
},
},
分析
通过build 打印的 webpack config 发现,nuxt2 中服务端的 webpack 配置默认是不进行minimizer
的。 推测是因为源码也不会暴露,而且也不存在网络传输,所以服务端的代码不需要进行压缩,nuxt2 默认就没有走 terser的配置。
解决
那么判断是build时,判断时服务端代码打包,手动引入 terser 插件配置即可。
为了方便定位服务端位置,变量名混淆是关闭的。
build: {
extend(config, ctx) {
const { isClient } = ctx
if(!isClient && ['prod', 'pre'].includes(STAGE)){
config.optimization.minimizer = [
new TerserPlugin({
sourceMap: false,
terserOptions: {
compress: {
drop_console: true, // 只移除 console
drop_debugger: true, // 移除 debugger
},
mangle: false, // 关闭变量名混淆
output: {
beautify: true, // 保持代码美化
comments: false // 移除注释
}
}
})
]
}
return config
}
}
服务端进行压缩时候会消耗一定的 build时长,导致整个部署时间拉长,如果前期规划的比较好,也可以不用进行这个压缩。比如项目的 console日志提前封装好,项目规范里规定必须使用封装的 log 方法,那么可以在封装 log里自定义如何时机或者场景打印日志。