react之webpack常用配置

create-creact-app项目，如果需要手动修改配置，需先npm run eject弹出配置，这个过程是不可逆的。

如何在不通过npm run eject进行webpack配置了？

1.用craco配置来去进行webpack相关配置。
2.用react-app-rewired 和 customize-cra进行webpack配置。

第一种方式：用craco配置来去修改webpack配置

 yarn add  @craco/craco
//或者
 npm install  @craco/craco --save

修改package.json

"scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "craco eject"
}

在项目根目录新建craco.config.js文件

1.打包build生成gizp压缩文件

npm install compression-webpack-plugin --save

在craco.config.js里添加

const CompressionWebpackPlugin = require('compression-webpack-plugin');
const webpack = require('webpack')
module.exports = {
    webpack: {