vue-cli3自动消除console.log()的调试信息方式

在vue-cli3里面已经有这个功能了，只需要开启这个功能就行了，默认是关闭的

1、找到生产环境的配置文件

2、然后找到 UglifyJsPlugin 这个插件添加一行代码

补充知识：Vue cli3 实现去除console.log 去除控制台输出

下载移除控制台输出的包

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

新建

babel.config.js

let plugins = [
 vant插件的按需加载
 [
 'import',
 {
  libraryName: 'vant',
  libraryDirectory: 'es',
  style: true
 },
 'vant'
 ]
]
//在打包的时候，加入移除控制台输出插件
if (process.env.NODE_ENV === 'production') {
 plugins.push('transform-remove-console')
}
module.exports = {
 presets: ['@vue/app'],
 plugins: plugins
}

以上这篇vue-cli3自动消除console.log()的调试信息方式就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • vue-cli3全面配置详解

    本文介绍了vue-cli3全面配置详解,分享给大家,具体如下: vue-cli3-config 创建项目 配置环境变量 通过在package.json里的scripts配置项中添加--mode xxx来选择不同环境 在项目根目录中新建.env, .env.production, .env.analyz等文件 只有以 VUE_APP_ 开头的变量会被 webpack.DefinePlugin 静态嵌入到客户端侧的包中,代码中可以通过process.env.VUE_APP_BASE_API访问 NO

  • vue-cli3.0使用及部分配置详解

    好长一段时间没有关注vue脚手架了,昨天因为需要个后台模板,用脚手架 搞了一下,竟然发现指令不能用了,看官方文档已经升级3.0,也是试的玩了一下, 大致写写怎么玩的! 1.先全局安装vue-cli3.0 检测安装: vue -V 2.创建项目(这个就跟react创建脚手架项目比较像了) 这里如果你是第一次用3.0版本的话,是没有前两个的,而只有最后两个,这里是 让你选的,第一个是默认配置,一般选第二个,自己配置,这里选择最后一个 在选择功能后,会询问更细节的配置, TypeScript: 是否使

  • vue-cli3 取消eslint校验代码的解决办法

    在网上找了各种办法都没解决,看了下文档就解决了关闭vue-cli3.0 报错:eslint-disable-next-line to ignore the next line. 注意我这里是VUE3.0 解决方法: 找到文件vue.config.js (备注我这里是vue-cli3.0)打开文件 修改lintOnSave 为false,如果没有就添加lintOnSave 为false 下图: 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们.

  • vue-cli3自动消除console.log()的调试信息方式

    在vue-cli3里面已经有这个功能了,只需要开启这个功能就行了,默认是关闭的 1.找到生产环境的配置文件 2.然后找到 UglifyJsPlugin 这个插件添加一行代码 补充知识:Vue cli3 实现去除console.log 去除控制台输出 下载移除控制台输出的包 npm install babel-plugin-transform-remove-console --save-dev 新建 babel.config.js let plugins = [ vant插件的按需加载 [ 'im

  • Vue Cli3 打包配置并自动忽略console.log语句的方法

    下载插件 npm i -D uglifyjs-webpack-plugin 在 vue.config.js 引入使用 const UglifyJsPlugin = require('uglifyjs-webpack-plugin') module.exports = { configureWebpack: { plugins: [ new UglifyJsPlugin({ uglifyOptions: { compress: { drop_console: true, }, }, }), ],

  • Vue通过URL传参如何控制全局console.log的开关详解

    前言 最近在学习vue,发现了一个问题网上相关的信息很少,所以想着总结下,本文主要给大家介绍了关于Vue通过URL传参来控制全局console.log开关的相关内容,分享出来供大家参考学习,下面话不多说了,来随着小编一起看看详细的介绍吧. 实现方法如下: 如果你的项目中console.log了很多信息,但是发到生产环境上又不想打印这些信息,这时候就需要设置一个全局变量,如:debug, 用正则匹配一下参数: const getQueryStr = (name) => { var reg = ne

  • JavaScript调试技巧之console.log()详解

    JavaScript调试技巧之console.log()详解

    一.什么是console.log()?除了一些很老版本的浏览器,现今大多数浏览器都自带调试功能:即使没有调试功能,也可以通过安装插件来进行补充.比如,老版本的Firefox没有自带调试工具,在这种情况下可以通过安装Firebug插件来添加调试功能.在具备调试功能的浏览器上,window对象中会注册一个名为console的成员变量,指代调试工具中的控制台.通过调用该console对象的log()函数,可以在控制台中打印信息.比如,以下代码将在控制台中打印"Sample log": 复制代

  • vue中使用console.log打印的实现

    目录 vue使用console.log打印 注释vue中所有的console.log vue使用console.log打印 1.使用window.console.log() 2.更改配置: 在package.json文件中的eslintConfig选项中rules对象里面增加:“no-console”:“off” 注释vue中所有的console.log 在前端开发的过程中一般会打印很多的日志但是要发布到线上的时候不希望客户看到其他的信息,但是一个一个的注释太麻烦也不利于以后进行更新 下面是个很

  • JavaScript中的console.log()函数详细介绍

    JavaScript中的console.log()函数详细介绍

    对于JavaScript程序的调试,相比于alert(),使用console.log()是一种更好的方式,原因在于:alert()函数会阻断JavaScript程序的执行,从而造成副作用:而console.log()仅在控制台中打印相关信息,因此不会造成类似的顾虑. 什么是console.log()? 除了一些很老版本的浏览器,现今大多数浏览器都自带调试功能:即使没有调试功能,也可以通过安装插件来进行补充.比如,老版本的Firefox没有自带调试工具,在这种情况下可以通过安装Firebug插件来

  • JS中捕获console.log()输出的方法

    本文实例讲述了JS中捕获console.log()输出的方法.分享给大家供大家参考.具体分析如下: 我们知道console.log()可以将信息输出到debugger中供开发者查看.但如果我们想要在JS中获取console.log()的输出结果呢?其实不难,先将原本的console.log保存起来,然后替换成另外一个实现即可.代码如下: var lastLog; console.oldLog = console.log; console.log = function(str) { console

  • JavaScript调试之console.log调试的一个小技巧分享

    JavaScript调试之console.log调试的一个小技巧分享

    前言 对于JavaScript程序的调试,相比于alert(),使用console.log()是一种更好的方式,原因在于:alert()函数会阻断JavaScript程序的执行,从而造成副作用: alert弹出框需要点击确认比较麻烦,而console.log()仅在控制台中打印相关信息,因此不会造成类似的顾虑. 最重要的是alert只能输出字符串,不能输出对象里面的结构,console.log()可以接受任何字符串.数字和JavaScript对象,可以看到清楚的对象属性结构,在ajax返回jso

  • javascript 在firebug调试时用console.log的方法

    console.log(); 当你使用console.log()函数时,下面的firebug一定要打开,不然这函数在用firefox运行时无效且影响正常程序,如果用IE打开,将会出错. 第一个参数可以是一个包含格式化占位符输出的字符串,例如: console.log("The %s jumped over %d tall buildings", animal, count); 格式化字符串 类型 %s 字符串 %d, 整型 %i (暂不支持数字型) %f 浮点型 (暂不支持数字型) %

  • javascript代码调试之console.log 用法图文详解

    javascript代码调试之console.log 用法图文详解

    大家都有用过各种类型的浏览器,每种浏览器都有自己的特色,本人拙见,在我用过的浏览器当中,我是最喜欢Chrome的,因为它对于调试脚本及前端设计调试都有它比其它浏览器有过之而无不及的地方.可能大家对console.log会有一定的了解,心里难免会想调试的时候用alert不就行了,干嘛还要用console.log这么一长串的字符串来替代alert输出信息呢,下面我就介绍一些调试的入门技巧,让你爱上console.log 先的简单介绍一下chrome的控制台,打开chrome浏览器,按f12就可以轻松

随机推荐