Vue关闭线上源码移除console

简介: Vue关闭线上源码移除console

不管前方的路有多苦,只要走的方向正确,不管多么崎岖不平,都比站在原地更接近幸福。


前言


文章中的配置,项目基于Vue CLI 3.0搭建,版本大于等于3.0不会有问题,其他环境版本请绕道😂。


关闭线上源码


  • 在Vue.config.js中添加如下代码


module.exports = {
    // 关闭线上源码
    productionSourceMap: false,
}


  • 移除后的效果


640.png


移除console


使用TerserPlugin插件实现


  • 安装插件:终端执行


yarn add terser-webpack-plugin


  • 在vue.config.js中添加如下代码


module.exports = {
    configureWebpack:{
        optimization:{
            minimizer: [new TerserPlugin({ terserOptions: { compress: { drop_console: true } } })]
        }
    }
}


  • 插件的更多使用方法:terser-webpack-plugin


使用cli自带的配置实现


感谢评论区掘友(@小小茂茂)给的建议,代码已测试,可移除console


  • 在vue.config.js中添加如下代码


// 关闭生产环境console
configureWebpack(config) {
    if (process.env.NODE_ENV === 'production') {
        config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true
    }
}


写在最后


  • 公众号无法外链,如果文中有链接,可点击下方阅读原文查看😊


  • 由于公众号字数限制,所以此处拿点鸡汤过来。


上海虹桥机场有这么一个故事,一对恋人在机场分手,女对男说“你别等我了我们不会有结果,就像机场永远等不来火车,我们以后也不会有交集”没过几年 虹桥机场跟火车站连在了一起,设计这个工程的总工程师就是那个男的 ,只要有爱就有办法,任何人都可以无止境的对一个人好,但是前提提是值得。

你对我一直很好,我也想对你很好,可是我们一直在错过,一开始你有一个异地恋女朋友,后面你们分手了,我又有一段恋情,后来我分手了,但是我们就毕业了,你没有对我告过白,只对我在毕业聚餐那天晚上唱了一首灰姑娘,你说那是对我唱的,视频我保存在了我心里。

相关文章
|
2天前
|
JavaScript
vue页面加载时同时请求两个接口
vue页面加载时同时请求两个接口
|
2天前
|
JavaScript
vue里样式不起作用的方法,可以通过deep穿透的方式
vue里样式不起作用的方法,可以通过deep穿透的方式
10 0
|
2天前
|
移动开发 JavaScript 应用服务中间件
vue打包部署问题
Vue项目`vue.config.js`中,`publicPath`设定为"/h5/party/pc/",在线环境基于打包后的`dist`目录,而非Linux的`/root`。Nginx代理配置位于`/usr/local/nginx/nginx-1.13.7/conf`,包含两个相关配置图。
vue打包部署问题
|
2天前
|
JavaScript 前端开发
iconfont 图标在vue里的使用
iconfont 图标在vue里的使用
13 0
|
1天前
|
JavaScript
vue打印v-model 的值
vue打印v-model 的值
|
2天前
|
JavaScript
Vue实战-组件通信
Vue实战-组件通信
4 0
|
2天前
|
JavaScript
Vue实战-将通用组件注册为全局组件
Vue实战-将通用组件注册为全局组件
5 0
|
2天前
|
JavaScript 前端开发
vue的论坛管理模块-文章评论02
vue的论坛管理模块-文章评论02
|
2天前
|
JavaScript Java
vue的论坛管理模块-文章查看-01
vue的论坛管理模块-文章查看-01