vue-cli2.0和vue-cli3.0中当发布到生产环境时禁用console.log

vue-cli2.0中的方法

1.安装插件

npm install uglifyjs-webpack-plugin --save-dev

2.修改webpack.prod.conf.js配置文件

const UglifyJsPlugin = require(‘uglifyjs-webpack-plugin‘);
plugins: [
        // http://vuejs.github.io/vue-loader/en/workflow/production.html
        new webpack.DefinePlugin({
            ‘process.env‘: env
        }),
        new UglifyJsPlugin({
            uglifyOptions: {
                // include: /\/src/,
                compress: {
                    warnings: false,
                    drop_debugger: true, //自动删除debugger
                    drop_console: true //自动删除console.log
                }
            },
            sourceMap: config.build.productionSourceMap,
            parallel: true
        }),
......

vue-cli3.0中的方法

1.安装babel插件

cnpm i babel-plugin-transform-remove-console -D

2.修改babel.config.js文件如下

const plugins = [‘transform-remove-strict-mode‘];
if (process.env.NODE_ENV === ‘production‘ && process.env.VUE_APP_OpenLog == 0) {
  plugins.push(‘transform-remove-console‘);
}
module.exports = {
  presets: [
    [
      ‘@vue/app‘,
      {
        polyfills: [‘es6.promise‘, ‘es6.symbol‘]
      }
    ]
  ],
  ignore: [‘./src/assets/js/mui.js‘],
  plugins: plugins
};

完!

原文地址:https://www.cnblogs.com/jiekzou/p/11690916.html

时间: 2024-10-05 04:58:28

vue-cli2.0和vue-cli3.0中当发布到生产环境时禁用console.log的相关文章

利用ansible-playbook从测试环境获取tomcat中java项目新版本发布到生产环境

一.环境描述 安装有ansible的服务器:192.168.13.45 测试环境服务器:192.168.13.49 /home/app/api-tomcat/webapps/api.war为测试环境新版本war包位置 生产环境服务器:192.168.13.51 /home/app/api-tomcat/webapps/api.war为生产环境war包位置     /home/app/api-tomcat/webapps/api为生产环境项目位置 /home/app/tomcat.bak/api/

vue中使用axios给生产环境和开发环境配置不同的baseUrl

第一步:设置不同的接口地址 找到文件:/config/dev.env.js 代码修改为: var merge = require('webpack-merge') var prodEnv = require('./prod.env') module.exports = merge(prodEnv, { NODE_ENV: '"development"', //添加 API_ROOT: '"//192.168.1.8/api"' }) /config/prod.env

【Vue】详解Vue生命周期

Vue实例的生命周期全过程(图) (这里的红边圆角矩形内的都是对应的Vue实例的钩子函数) 在beforeCreate和created钩子函数间的生命周期 在beforeCreate和created之间,进行数据观测(data observer) ,也就是在这个时候开始监控data中的数据变化了,同时初始化事件 created钩子函数和beforeMount间的生命周期 对于created钩子函数和beforeMount间可能会让人感到有些迷惑,下面我就来解释一下: el选项的有无对生命周期过程

vue学习——刚学Vue组件,吐槽一个东西

Vue组件的props是用来传值的 这里是官方链接 template:"<bbb @click='onClick()'>{{value}}</bbb>", //"<div>{{value}}</div>" 讨厌的东西就出在这行代码,一个组件的 template 调用同级别的组件 bbb 然后使用 props 传值,结果是行不通的,并且没有报错!虽然,明知道是什么问题,可是还是令我感到不舒服. 测试代码: <!DO

linux生产环境中替换jdk

声明一下,为了给大家演示以及对生产环境的保密,我在本地vm中搭建了跟生产环境一模一样的虚拟机来给大家操作,其中截图来自本地虚拟机.操作步骤严格按照生产环境替换来做. 首先,给大家介绍下生产环境的大体架构,前端采用nginx分发,后端两个tomcat处理请求应用服务器,这只是最基本也是最常见的负载均衡架构. 下面开始实际操作:(注:请使用root账户操作) 第一步:首先看一下系统的java版本.系统采用openJDK,并且为1.7.0_85版本 第二步:安装sunjdk 1使用命令新建一个文件夹s

vue 安装cli3.0版本,创建项目

注意:Vue CLI需要Node.js版本8.9或更高版本(建议使用8.11.0+). 查看node版本:node -v  , 查看npm 版本  npm -v, 1.首先需要安装node.js环境 2.如果在vue-cli全局安装了以前的(1.x或2.x)软件包,则需要先使用npm uninstall vue-cli -g或卸载它yarn global remove vue-cli. 3.使用以下命令行安装cli3  1.npm install -g @vue/cli     2.npm in

vue cli3.0用axios调用本地json数据一直报404

最近在基于vue做后台管理系统时,用了vue cli3.0用axios调用本地json数据一直报404,市面上所有的解决办法都没用,快崩溃了,结果最后发现原因是,vue cli3.0 public 文件夹才是静态资源文件,问题解决,记录一下,以后不再踩坑. 最近发现好多人都踩这个坑,索性把我的结构发出来. 参考地址:https://www.love85g.com/?p=1500 原文地址:https://www.cnblogs.com/dapengFly/p/11359456.html

Vue2.0总结———vue使用过程常见的一些问题

Vue目前的的开发模式主要有两种: 1.直接页面级的开发,script直接引入Vue 2.工程性开发,webpack+loader或者直接使用脚手架工具Vue-cli,里面的文件都配置好了 webpack可以进行配置,配置多文件入口,进行多页面开发 第二种Vue开发,结合webpack打包完文件会很大,怎么解决这个问题? 1.webpack代码拆分:code-spliting 2.提取公共(如提取css,js) 3.预渲染:使用prerender-spa-plugin插件 4.后台----开启压

Vue2.0笔记——Vue实例

Vue实例 每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的: var vm = new Vue({ // 选项 }) 当创建一个 Vue 实例时,你可以传入一个选项对象,就如前面所提到的如:data,methods,computed,watch等等.一个 Vue 应用由一个通过 new Vue 创建的根 Vue 实例,以及可选的嵌套的.可复用的组件树组成.举个例子,一个 todo 应用的组件树可以是这样的: 根实例Root └─ TodoList ├─ TodoIte