如何压缩react打包编译build的js、css大小

#1

我是通过create-react-app app创建项目的，然后通过npm run eject 创建自定义webpack工具，然后自己引入其他模块，写了一些功能（有antd、barft.js等），最后我通过npm run build打包项目，最后产生一个“build”的文件夹，里面的static有js和css文件，

我们可以看到一个是main.js的文件大写为1.7M,毫无疑问，这个文件是非常大的，如何能使这个文件压缩呢？同时，我进入其他路由页面，加载的js和css都是main的，说明其他页面的js都捆绑到这个js里了，其他页面加载都是同一个js和css的，如何能根据路由按需加载js和css？从而将这个1.7M的js分包呢？

#2

react代码分割、antd按需引入，会好很多

#3

1.可以使用webpack插件进行压缩：
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
})
具体用法可以查下webpack文档。
2.可以使用webpack插件进行分包：
new webpack.optimize.CommonsChunkPlugin({
names: [‘vendor’]
})
此时，entry入口要配置成：
entry: {
vendor: [‘react’, ‘react-dom’, ‘antd’, ‘barft’],
index: ‘main.js’
}

#4