vue打包后去除代码中的console.log输出

vue打包后去除代码中的console.log输出

项目上线的时候都不需要看到一些debug输出的内容,所以要去除console.log
在vue 2中webpack中在生产环境的插件中添加配置

// 代码:
plugins: [
        // http://vuejs.github.io/vue-loader/en/workflow/production.html
        new webpack.DefinePlugin({
            'process.env': env
        }),
        new UglifyJsPlugin({
            uglifyOptions: {
                compress: {
                    warnings: false,
                    //过滤console.log-start
                    drop_console: true,
                    pure_funcs: ['console.log']
                    //过滤console.log-end
                }
            },
            sourceMap: config.build.productionSourceMap,
            parallel: true
        })
 ]

在vue3中可以简单的创建根目录下babel.config.js文件,安装插件npm install babel-plugin-transform-remove-console --save-dev
在配置文件中写入

const proPlugins = [];// 开发环境 不做操作

// 生产环境,去掉console
if (process.env.NODE_ENV === 'production') {
    proPlugins.push('transform-remove-console');
    console.log('production环境')
}
module.exports = {
  presets: [
    '@vue/app'
  ],
  plugins:[
    ...proPlugins
  ]
}
上一篇:生产环境(production) 打开 Vue 调试工具的方法


下一篇:小程序构建npm问题