我使用React，FullCalendar，JQuery，Material UI和Formsy-material-ui做了一个小应用程序。
该应用程序包含显示带事件的fullcalendar。
这个事件是在点击日历的某个位置创建的，它在一个Dialog中使用FormsySelect，FormsyDatepicker或FormsyTextfield等组件呈现一个Form。
当我使用webpack进行构建时，会生成一个重量为588kb的包。
顺便说一句，我在另一个组件中加载了对话框。
如果我没有渲染我的Dialog组件，则捆绑包的大小为220kb。
Material UI可以负责吗？。
编辑：我将我在Dialog Component中创建的导入保留。
import React, { Component, PropTypes } from 'react';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import Formsy from 'formsy-react';
import RaisedButton from 'material-ui/RaisedButton';
import MenuItem from 'material-ui/MenuItem';
import { FormsySelect, FormsyText, FormsyTime, FormsyDate, FormsyCheckbox } from 'formsy-material-ui/lib';
import Dialog from 'material-ui/Dialog';
import { mouseTrap } from 'react-mousetrap';
答案 0 :(得分：1)
解决此问题的正确方法是首先分析您的捆绑。尝试针对它运行source-map-explorer：
$ sudo npm install -g source-map-explorer
$ source-map-explorer bundle.min.js
$ source-map-explorer bundle.min.js bundle.min.js.map
这将打开一个关于如何在缩小的束中使用空间的可视化。
另一个好工具是webpack-bundle-analyzer。