react打包优化，gizp

• 1、如果你的项目中没有使用按需加载的组件的话那么使用下方的指令，将react中的webpack配置文件进行显示，默认是隐藏的

npm run eject

• 2、下载插件（使用低版本的，不要用最新版，会报错的）

npm i compression-webpack-plugin@5.0.1 -S-D

• 3、在config->webpack.config.js中引入

const CompressionPlugin = require("compression-webpack-plugin");
new CompressionPlugin({
filename: "[path].gz[query]",
algorithm: "gzip",
test: /.js/,
threshold: 10240,
minRatio: 0.8
}),

image.png
image.png

• 4、如果你的项目中使用了ui组件的按需引入，那么就是直接使用步骤2下载插件，配置的时候，在你配置按需引入的那个文件中进行配置就好了

image.png