减小react+material ui生成的压缩文件或bundle.js文件的大小

问题描述：

前端开发，使用react和matrial ui开发， 生成的打包文件，js文件的大小，竟然达到3M.

寻找减小打包文件的大小的方法。尝试了很多解决方案，都是减小100k左右，不能解决问题。

参考官网material信息：https://material-ui.com/guides/minimizing-bundle-size/

解决方案：

1. 修改 每个文件中@material-ui/core的引入方法，结果大小只减小了100k，杯水车薪。

将类似   import xxx from @material-ui/core 的引入写法，全部改为

import xxx from @material-ui/core/xxx的写法。也就是 引入core下面的路径，而不是 core这一层路径

例如把下面这行

import { Button, TextField } from '@material-ui/core';
           

改成

import Button from '@material-ui/core/Button';
import TextField from '@material-ui/core/TextField';
           

2. 重点！！！修改每个文件中@material-ui/icons，结果大小嗖的一下从3M降为600K。所以@material-ui/icons 比@material-ui/core 占的空间更大，icons才是导致打包文件变得庞大的罪魁祸首！

 import xxx from @material-ui/icons 的引入写法，全部改为

import xxx from @material-ui/icons/xxx的写法。也就是 引入icons下面的路径，而不是 icons这一层路径。

示例：

导致打包文件变大的代码如下：

import { Check, Clear } from '@material-ui/icons';

改进版如下：

import Check from '@material-ui/icons/Check';

import Clear from '@material-ui/icons/Clear';