前言
- 在开发阶段我们经常为了调试代码会打印一些数据,方便查看和修改数据
- 但是这些打印如果在生产环境下展示的话就不太有好了,可以借助插件和代码写法来解决
- 不建议使用插件,可以在main.js(入口文件)和vue.config.js(环境文件)来解决
代码实现
1.main.js-入口文件实现
// 正式环境清除所有console.log
if (process.env.NODE_ENV === 'production') {
if (window) {
window.console.log = function () {}
}
}
2.vue.config.js-环境文件实现-chainWebpack (config) {}
chainWebpack (config) {
// 去除打包环境的console
config.optimization.minimizer('terser').tap(args => {
args[0].terserOptions.compress.drop_console = true
return args
})
}
总结:
经过这一趟流程下来相信你也对 vue-打包上线之后去除console.log() 有了初步的深刻印象,但在实际开发中我 们遇到的情况肯定是不一样的,所以我们要理解它的原理,万变不离其宗。加油,打工人!
什么不足的地方请大家指出谢谢 -- 風过无痕