react打包去除console

uglifyjs-webpack-plugin

这个webpack插件可以帮助你在打包的时候去掉console,因为我的是使用create-react-app创建的项目,并且没有使用eject将包解出来,所以我采用了customize-crareact-app-rewired
使用:

  1. 安装这三个插件
npm i customize-cra react-app-rewired --dev
npm install uglifyjs-webpack-plugin --save-dev
  1. 修改package.json
   "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-app-rewired eject"
  },
  1. 在项目根目录创建一个config-overrides.js
  2. 将下面代码添加到config-overrides.js中
const { override, addWebpackPlugin } = require('customize-cra');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = override(
// 判断环境,只有在生产环境的时候才去使用这个插件
  // 如果不想这样做的话可以只修改build的命令为"build": "react-app-rewired build"
  process.env.NODE_ENV === 'production' && addWebpackPlugin(new UglifyJsPlugin({
    uglifyOptions: {
      compress: {
        drop_debugger: true,
        drop_console: true
      }
    }
  }))
);

你可能感兴趣的:(react打包去除console)