在 vite 项目中配置 terser 压缩，需要修改 vite.config.js 文件，通过 build.minify 选项指定使用 'terser'，并在 build.terseroptions 中传入具体的压缩参数。这样做会在生产构建时启用 terser 引擎对 javascript 代码进行压缩和混淆，从而减小打包体积。
Vite 如何切换为 Terser 压缩器
默认情况下，Vite 使用 ESBuild 进行代码压缩，它速度极快但压缩率不如 Terser。若需获得更小的包体积，必须显式将 build.minify 设置为 'terser'。这通常用于对文件大小有严格要求的生产环境部署场景。
import { defineConfig } from 'vite';
export default defineConfig({
build: {
minify: 'terser',
terserOptions: {
compress: {
drop_console: true,
drop_debugger: true
}
}
}
});上述配置中，drop_console 设为 true 会移除所有 console.log 等语句，drop_debugger 移除 debugger 语句。这是最常见的优化手段之一。执行 vite build 后，输出目录中的 JS 文件将经过 Terser 处理。
立即学习“Java免费学习笔记（深入）”；
Terser 常用压缩参数有哪些
Terser 提供了丰富的 compress 选项来控制压缩行为。例如 dead_code 用于移除未使用的代码块，unused 用于移除未引用的函数参数。这些参数能进一步缩小代码体积，但需注意某些参数可能影响代码运行逻辑，建议在测试环境中验证。
import { defineConfig } from 'vite';
export default defineConfig({
build: {
minify: 'terser',
terserOptions: {
compress: {
dead_code: true,
unused: true,
sequences: true
},
mangle: {
toplevel: true
}
}
}
});在 mangle 部分设置 toplevel: true 会对顶层变量和函数名也进行混淆，进一步减小文件名长度。但需注意，如果项目中有依赖全局变量的第三方库或插件，开启此选项可能导致运行时错误。因此，通常建议仅在确认无副作用的情况下启用。
Terser 压缩对源码映射的影响
当启用 Terser 压缩时，若同时配置了 build.sourcemap 为 true，Terser 会生成对应的源映射文件。这有助于在生产环境中调试压缩后的代码。然而，源映射文件会显著增加构建产物的大小，因此在生产环境中通常建议关闭源映射，或在需要调试时单独生成。
