【vue】 将Vue2中的console.log()调试信息移除

本文涉及的产品
日志服务 SLS,月写入数据量 50GB 1个月
简介: 【vue】 将Vue2中的console.log()调试信息移除

前言

最近写了个vue2项目自己部署上线,上线后发现控制台居然有log,如果让别有用心的人看见了一下重要数据是万万不能的。所以上网百度解决

参考文章:将Vue2中的console.log()调试信息移除

安装依赖

npm install babel-plugin-transform-remove-console --save-dev

配置babel.config.js

在文件中加入下面配置

module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ],
  plugins: [ 
  // 加入以下内容,引入插件。
   'transform-remove-console'
  ]
}

注意:添加完后,因为是配置文件所以要重新启动项目,npm run dev。这个时候打包再部署上线控制台就没有log了,但是在本地跑项目log也没了,所以接着往下看。。。。

配置只在线上移除log

配置babel.config.js文件

const prodPlugins = []
if (process.env.NODE_ENV === 'production') {
  prodPlugins.push('transform-remove-console')
}

module.exports = {
  presets: [ // 原有的默认配置
    '@vue/cli-plugin-babel/preset'
  ],
  plugins: prodPlugins
}


在 npm run build 之后生成的dist/中的文件将自动移除console.log()的输出语句。一般用于发布项目时使用。(即这个时候本地log正常,部署上线的控制台没有log)


下班~

相关实践学习
日志服务之使用Nginx模式采集日志
本文介绍如何通过日志服务控制台创建Nginx模式的Logtail配置快速采集Nginx日志并进行多维度分析。
目录
相关文章
|
1月前
|
Java 程序员 应用服务中间件
「测试线排查的一些经验-中篇」&& 调试日志实战
「测试线排查的一些经验-中篇」&& 调试日志实战
20 1
「测试线排查的一些经验-中篇」&& 调试日志实战
|
1月前
|
存储 数据采集 分布式计算
Hadoop-17 Flume 介绍与环境配置 实机云服务器测试 分布式日志信息收集 海量数据 实时采集引擎 Source Channel Sink 串行复制负载均衡
Hadoop-17 Flume 介绍与环境配置 实机云服务器测试 分布式日志信息收集 海量数据 实时采集引擎 Source Channel Sink 串行复制负载均衡
42 1
|
2月前
|
Java
日志框架log4j打印异常堆栈信息携带traceId,方便接口异常排查
日常项目运行日志,异常栈打印是不带traceId,导致排查问题查找异常栈很麻烦。
|
1月前
|
存储 缓存 网络协议
搭建dns服务常见报错--查看/etc/named.conf没有错误日志信息却显示出错(/etc/named.conf:49: missing ‘;‘ before ‘include‘)及dns介绍
搭建dns服务常见报错--查看/etc/named.conf没有错误日志信息却显示出错(/etc/named.conf:49: missing ‘;‘ before ‘include‘)及dns介绍
107 0
|
3月前
|
Kubernetes 数据安全/隐私保护 容器
【Azure APIM】APIM Self-Hosted网关中,添加网关日志以记录请求头信息(Request Header / Response Header)
【Azure APIM】APIM Self-Hosted网关中,添加网关日志以记录请求头信息(Request Header / Response Header)
|
3月前
|
Go 开发者
【应用服务 App Service】App Service发生错误请求时,如何查看IIS Freb日志,从中得知错误所发生的模块,请求中所携带的Header信息
【应用服务 App Service】App Service发生错误请求时,如何查看IIS Freb日志,从中得知错误所发生的模块,请求中所携带的Header信息
|
3月前
|
监控 安全 Linux
在Linux中,某个账号登陆linux后,系统会在哪些日志文件中记录相关信息?
在Linux中,某个账号登陆linux后,系统会在哪些日志文件中记录相关信息?
|
3月前
|
SQL 数据库 Java
Hibernate 日志记录竟藏着这些秘密?快来一探究竟,解锁调试与监控最佳实践
【8月更文挑战第31天】在软件开发中,日志记录对调试和监控至关重要。使用持久化框架 Hibernate 时,合理配置日志可帮助理解其内部机制并优化性能。首先,需选择合适的日志框架,如 Log4j 或 Logback,并配置日志级别;理解 Hibernate 的多级日志,如 DEBUG 和 ERROR,以适应不同开发阶段需求;利用 Hibernate 统计功能监测数据库交互情况;记录自定义日志以跟踪业务逻辑;定期审查和清理日志避免占用过多磁盘空间。综上,有效日志记录能显著提升 Hibernate 应用的性能和稳定性。
49 0
|
3月前
|
存储 JSON 监控
FastAPI日志之谜:如何揭开Web应用监控与调试的面纱?
【8月更文挑战第31天】在现代Web开发中,日志记录对于监控应用状态、诊断问题和了解用户行为至关重要。FastAPI框架提供了强大的日志功能,使开发者能轻松集成日志记录。本文将详细介绍如何在FastAPI中设置和利用日志,包括基础配置、请求响应日志、错误处理和结构化日志等内容,帮助提升应用的可维护性和性能。
127 0
|
3月前
|
API
【Azure 服务总线】查看Service Bus中消息多次发送的日志信息,消息是否被重复消费
【Azure 服务总线】查看Service Bus中消息多次发送的日志信息,消息是否被重复消费