vue-cli3/webpack打包时去掉console.log调试信息

文章目录

  • 前言
  • 一、terser-webpack-plugin是什么?
  • 二、使用配置
    • vue-cli项目


前言

开发环境下,console.log调试信息,有助于我们找到错误,但在生产环境,不需要console.log打印调试信息,所以打包时需要将console.log调试信息过滤清除。


一、terser-webpack-plugin是什么?

该插件使用 terser 来压缩 JavaScript。

terser-webpack-plugin是用来压缩 js 的,开发环境的console.log、debugger 等用来调试的信息,打包时都需要这个插件。

webpack v5 开箱即带有最新版本的 terser-webpack-plugin。如果你使用的是 webpack v5 或更高版本,同时希望自定义配置,那么仍需要安装 terser-webpack-plugin。如果使用 webpack v4,则必须安装 terser-webpack-plugin v4 的版本。

如果是vue-cli3的话,默认安装了terser-webpack-plugin,如果没安装下面可以直接复制。

npm install terser-webpack-plugin --save-dev

二、使用配置

vue-cli项目

vue-cli项目默认是基于webpack打包工具的,但是项目的配置文件是vue.config.js,其他项目在webpack.config.js配置
在这里插入图片描述
代码配置如下:

//vue.config.js
const TerserPlugin = require('terser-webpack-plugin')module.exports = {configureWebpack: {optimization: {minimizer: [new TerserPlugin({terserOptions: {compress: {drop_console: true // 注释console}}})]}},
}

如果上面的配置文件无效可以试试下面的配置,参数不同,可能是因为版本不同,我的是webpack4,vue-cli3.

//vue.config.js
const TerserPlugin = require('terser-webpack-plugin')
module.exports = {
configureWebpack: {optimization: {minimizer: [new TerserPlugin({terserOptions: {ecma: undefined,warnings: false,parse: {},compress: {drop_console: true,drop_debugger: false,pure_funcs: ['console.log'] // 移除console}},}),]}}},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/583931.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

servlet+jdbc实现用户注册功能

一、需求 在Servlet中可以使用JDBC技术访问数据库,常见功能如下: 查询DB数据,然后生成显示页面,例如:列表显示功能。接收请求参数,然后对DB操作,例如:注册、登录、修改密码等功能。…

前端基本性能指标及lighthouse使用

文章目录 1、基本指标介绍2、Performace分析2.1 performance属性2.2 使用performace计算2.3 Resource Timing API2.4 不重复的耗时时段区分2.5 其他组合分析2.6 JS 总加载耗时2.7 CSS 总加载耗时 3、lighthouse基本使用3.1 使用Chrome插件lighthouse3.2 使用Chrome浏览器开发者…

【操作系统】测试四

文章目录 单选题填空题 单选题 在一个可变分区存储管理中,最佳适应算法是将空闲区表中的空闲区按【 正确答案: C】的次序排列。 A. 地址递增 B. 地址递减 C. 大小递增 D. 大小递减 动态重定位是在【 正确答案: B】进行的重定位。 A. 作业执行前 B. 作业执行过程中 …

【黄啊码】宝塔设置默认php版本无效?

宝塔面板切换默认PHP版本1.情形描述: 我在执行composer install 时提示PHP版本太低,查看了一下宝塔面板的PHP版本,发现有两个一个5.6一个7.3。虽然php5.6版本已经暂停了,但是执行composer install还是提示版本太低。 然后根据网…

信息泄露总结

文章目录 一、备份文件下载1.1 网站源码1.2 bak文件泄露1.3 vim缓存1.4 .DS_Store 二、Git泄露2.1 git知识点2.1 log2.2 stash 三、SVN泄露3.1 SVN简介3.2 SVN的文件3.3 SVN利用 四、Hg泄露 一、备份文件下载 1.1 网站源码 常见的网站源码备份文件后缀: tartar.gz…

hyperf console 执行

一、原理描述 hyperf中,不难发现比如自定义控制器中获取参数,hyperf.php中容器获取,传入的都是接口,而不是实体类。 这是因为框架中的配置文件有设置对应抽象类的子类,框架加载的时候将其作为数组,使用的…

零基础学Java第二天

复习回顾: 1.dos命令 dir 显示当前文件夹下面的所有的文件和文件夹 cd 切换目录的 mkdir 创建文件夹的 rd 删除文件夹的 del 删除文件 D: 切换盘符 cls 清屏 2.书写Java代码换行打印《静夜诗》这首古诗 class Demo1 { …

深入理解 C# 中的字符串比较:String.CompareTo vs String.Equals

深入理解 C# 中的字符串比较:String.CompareTo vs String.Equals 在处理字符串时,了解如何正确比较它们对于编写清晰、有效和可靠的 C# 程序至关重要。本文将深入探讨 C# 中的两个常用字符串比较方法:String.CompareTo 和 String.Equals&…

Mybatis行为配置之Ⅲ—其他行为配置项说明

专栏精选 引入Mybatis Mybatis的快速入门 Mybatis的增删改查扩展功能说明 mapper映射的参数和结果 Mybatis复杂类型的结果映射 Mybatis基于注解的结果映射 Mybatis枚举类型处理和类型处理器 再谈动态SQL Mybatis配置入门 Mybatis行为配置之Ⅰ—缓存 Mybatis行为配置…

电子工程师如何接私活赚外快?

对电子工程师来说,利用业余时间接私活是个很常见的技术,不仅可以赚取额外收入,也能提升巩固技术,可以说国内十个工程师,必有五个在接私活养家糊口,如果第一次接私活,该如何做? 很多工…

再升级|川石教育鸿蒙应用开发4.0教程发布

全新鸿蒙蓄势待发 HarmonyOS是一款面向未来的全场景分布式智慧操作系统。 对于消费者而言,HarmonyOS用一个统一的软件系统从根本上解决消费者面对大量智能终端体验割裂的问题,为消费者带来统一、便利、安全的智慧化全场景体验。 对于开发者而言&#xf…

十二:爬虫-Scrapy框架(上)

一:Scrapy介绍 1.Scrapy是什么? Scrapy 是用 Python 实现的一个为了爬取网站数据、提取结构性数据而编写的应用框架(异步爬虫框架) 通常我们可以很简单的通过 Scrapy 框架实现一个爬虫,抓取指定网站的内容或图片 Scrapy使用了Twisted异步网…

15. Mysql 变量的使用

目录 变量的概述自定义变量系统变量查看系统变量系统变量赋值 局部变量总结参考资料 变量的概述 MySQL支持不同类型的变量,包括自定义变量、系统变量和局部变量。自定义变量是在会话中定义的变量,用于存储临时数据。系统变量是MySQL服务器提供的全局变量…

【C#】关于事件的使用ii,eg:{婚礼策划公司的组织者}

场景: 假设你是一家婚礼策划公司的组织者,你需要安排婚礼的各个方面,如音乐、鲜花、照片等。 事件的用法: 你创建了一个婚礼策划事件,并邀请了音乐师、花店、摄影师等作为订阅者。当婚礼日期临近时,你触发婚…

(切图笔记)layui表格单元格添加超链接 以及传参方法 亲测可用 附代码

layui在切图网日常的工作中常常用到,特别是它的layer弹窗,基本可以满足网站切图时候遇到的绝大多数弹窗的情况,参数比较丰富 灵活,是不可多得的网页插件之一,我见很多人说layui过时了,这是相比于vue正流行的…

Linux创建Macvlan网络

最近在看Docker的网络,测试Macvlan部分时,发现Docker创建Macvlan与预期测试结果不一样。所以查阅了Linux下配置Macvlan,记录如下。 参考 1.Linux Macvlan 2.图解几个与Linux网络虚拟化相关的虚拟网卡-VETH/MACVLAN/MACVTAP/IPVLAN 3.创建ma…

Java8 - 更优雅的字符串连接(join)收集器 Collectors.joining

Java8中的字符串连接收集器 在JDK8中,可以采用函数式编程(使用 Collectors.joining 收集器)的方式对字符串进行更优雅的连接。 Collectors.joining 收集器 支持灵活的参数配置,可以指定字符串连接时的 分隔符,前缀 和…

Sentinel-3如何处理并下载LST数据-陆地表面温度”(Land Surface Temperature)

LST 通常指的是“陆地表面温度”(Land Surface Temperature)。陆地表面温度是指地球表面上陆地部分的温度,而不包括水体表面。LST 是遥感技术中一个重要的参数,可以通过卫星遥感等手段进行测量和监测。 陆地表面温度对于许多领域…

浅谈高并发以及三大利器:缓存、限流和降级

引言 高并发背景 互联网行业迅速发展,用户量剧增,系统面临巨大的并发请求压力。 软件系统有三个追求:高性能、高并发、高可用,俗称三高。三者既有区别也有联系,门门道道很多,全面讨论需要三天三夜&#…

kibana(elk)使用脚本统计重点URL访问次数

文章目录 前言一、Elasticsearch脚本是什么?二、使用步骤前言 在日常工作中,需要定期对系统中一些重点URL进行访问统计,这个时候就需要借助一些工具进行分析处理 一、Elasticsearch脚本是什么? Elasticsearch脚本是Elasticsearch中用于自定义数据处理和查询逻辑的脚本代码…