create-react-app 打包代码优化

最近在写react，遇到打包的问题，来总结一下，踩的坑(create-react-app），且已经已经运行npn run eject命令。

1.项目使用的版本

1. react:：16.8.6
2. react-dom：16.8.6
3. react-redux：7.1.0
4. webpack：4.29.6

2.此版本项目打包(build)时，开启了soure-map,使总体的的项目变得很大，在config文件夹的webpack.config.js里的第33行，去掉打包后文件夹里的source-map文件

3.将第三方的库、公共的库打包到一块，作缓存。配置以下

splitChunks: {
	chunks: "all",
	name: "vender",
	cacheGroups: {
		vender: {
		name: "vendor",
		test: /[\\/]node_modules[\\/]/,
		chunks: "all",
		priority: 10,
		enforce: true
	},
	react: {
		name: "react",
		test: (module) => /react|redux/.test(module.context),
		chunks: "initial",
		priority: 11,
		enforce: true
	},
	antd: {
		name: "antd",
		test: (module) => {
			return /ant/.test(module.context);
		},
		chunks: "initial",
		priority: 11,
		enforce: true
		},
		moment: {
			name: "moment",
			test: (module) => {
				return /moment/.test(module.context);
			},
			chunks: "initial",
			priority: 13,
			enforce: true
		}
	}

4.在nginx上开启gzip

server{
 # 开启gzip压缩
  gzip on;
  gzip_buffers 32 4k;
  gzip_comp_level 6;
  gzip_min_length 200;
  gzip_types text/css text/xml application/javascript;
  gzip_vary on;
}

5.测试结果，在火狐上验证结果，不得不说第三方库真的太大了，不过在加载速度上大大提高，没有配置以前，打出来的包2M多，经过gzip只有800kb多

以上是个人配置，欢迎来吐槽，相互学习啊，以为不错给个关注呗，大佬。