首页vite自动屏蔽console.log

vite自动屏蔽console.log

时间: 2025-06-07 18:01:57 浏览: 21

### 如何配置 Vite 自动移除或屏蔽 `console.log` 日志 #### 使用 Terser 插件通过在 Vite 配置文件中集成 Terser 插件，可以在构建过程中自动去除所有的 `console.log()` 调用。具体操作如下：编辑项目的 `vite.config.ts` 文件，在其中加入 Terser 的配置项以确保当处于生产模式下时会执行相应的优化措施。 ```typescript import { defineConfig } from 'vite' import { terser } from 'rollup-plugin-terser' export default defineConfig(({ command }) => ({ build: { rollupOptions: { plugins: [ command === 'build' && terser({ compress: { drop_console: true, pure_funcs: ['console.log'] } }) ].filter(Boolean) } } })) ``` 此段代码利用 Rollup 提供的 API 来动态决定是否应用 Terser 压缩器，并设置其参数使得所有形式的日志记录语句均被丢弃[^1]。 #### 利用 ESLint 和 Prettier 进行静态分析另一种方式是在开发阶段借助于 Linter 工具如 ESLint 结合特定规则来检测并提示开发者存在不必要的调试信息；同时配合格式化工具 Prettier 可以帮助保持一致性的编码风格。不过这种方式并不能直接作用于最终发布的版本上，而是作为一种辅助手段提高代码质量[^2]。 #### 应用 Babel 插件对于那些希望更早介入编译过程的应用场景来说，则可以选择安装并配置 Babel 插件 `"babel-plugin-transform-remove-console"` 。这允许用户自定义哪些类型的日志应该保留还是舍弃，甚至可以根据当前运行环境做出区分处理——比如仅限于生产环境中生效[^5]。以上三种方案各有优劣之处，可根据实际需求灵活选用最合适的办法完成对 `console.log` 的管理任务。

阅读全文