欢迎来到代码驿站!

vue

当前位置:首页 > 网页前端 > vue

Vue项目WebPack打包删除注释和console

时间:2022-09-20 09:28:23|栏目:vue|点击:

WebPack打包删除注释和console

项目中使用了 jspdf 这个插件,webpack打包后注释里存在这样的

领导让删除,于是使用插件

cnpm install uglifyjs-webpack-plugin -D

vue.config.js里添加配置

const UglifyJsPlugin = require('uglifyjs-webpack-plugin') //引入插件
 
module.exports = {
  configureWebpack: {
    optimization: {
      minimizer: [
        new UglifyJsPlugin({
          uglifyOptions: {
            // 删除注释
            output: {
              comments: false
            },
            // 删除console debugger 删除警告
            compress: {
              drop_console: true, //console
              drop_debugger: false,
              pure_funcs: ['console.log'] //移除console
            }
          }
        })
      ]
    }
  }
}

npm run build打包去掉console和警告

在本地开发环境中肯定都会去打印一些数据,但是你如果上传到正式环境呢这些肯定不能再有了,但是你也不能一行一行的去注释掉吧,这样很麻烦所以vue在配置的时候其实是有这个配置的但是需要你自己去配置文件里面修改一下,这样才能方便你的开发二可以达到偷懒的地步

下面就说一下这个配置其实就两行代码就可以了

在这里插入图片描述

在build下面的webpack.prod.conf.js里面找到这里添加上

drop_console: true,
pure_funcs: [‘console.log']

这两句就可以完美解决了。

上一篇:Vue WebPack忽略指定文件或目录方式

栏    目:vue

下一篇:vue3中reactive数据被重新赋值后无法双向绑定的解决

本文标题:Vue项目WebPack打包删除注释和console

本文地址:http://www.codeinn.net/misctech/214203.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有