如何去除console

本文针对Taro项目

webpack

由于weapp、alipay、tt和H5使用的webpack打包，因此在webpackChain中使用uglifyjs-webpack-plugin 进行剔除console

taro-docs.jd.com/taro/docs/2…

1. 安装插件

yarn add uglifyjs-webpack-plugin -D

2. 配置

修改config/index.js 文件，加入如下配置

weapp、alipay、tt

 config.mini.webpackChain = (chain, webpack) => {

    // 生产环境去掉console.log

    if (process.env.NODE_ENV === 'production') {

      // eslint-disable-next-line import/no-extraneous-dependencies

      const UglifyJsPlugin = require('uglifyjs-webpack-plugin')

      chain.plugin('uglifyjs-webpack-plugin').use(UglifyJsPlugin, [

        {

          uglifyOptions: {

            compress: {

              warnings: false,

              drop_console: true, // console

              pure_funcs: ['console.log'] // 移除console

            }

          }

        }

      ])

    }

h5

 config.h5.webpackChain = (chain, webpack) => {

    // 生产环境去掉console.log

    if (process.env.NODE_ENV === 'production') {

      // eslint-disable-next-line import/no-extraneous-dependencies

      const UglifyJsPlugin = require('uglifyjs-webpack-plugin')

      chain.plugin('uglifyjs-webpack-plugin').use(UglifyJsPlugin, [

        {

          uglifyOptions: {

            compress: {

              warnings: false,

              drop_console: true, // console

              pure_funcs: ['console.log'] // 移除console

            }

          }

        }

      ])

    }

react-native （metro）

react-native使用的是metro打包，因此无法使用webpack的那套配置进行设置。taro文档对于这一块的说明对于Taro2.0.7版本是不准确的。

可以使用babel进行预处理

1. 安装

yarn add babel-plugin-transform-remove-console -D

2. 配置

修改babel配置文件babel.config.js

module.exports = {

  presets: ['module:metro-react-native-babel-preset'],

  env: { production: { plugins: ['transform-remove-console'] } }

}