将 Material-UI 组件集中到一个文件中
2016-04-10
1555
我目前正在使用 Material UI 和 ReactJS 开发一个 Meteor 项目。
我想要做的是有一个文件，其中
导入
我项目中需要的所有 Material UI 组件，然后只需在需要使用 Material 的地方导入这个文件，而不必将所有单独的导出粘贴在每个文件的顶部。
这可能吗？我对 ES6/2015 和导入/导出系统还很陌生，但我不确定我是否可以导入所有所述组件，然后以某种方式重新导出它们？
我很感激任何提前提供的帮助。我想这无论如何都不是项目的关键部分，但如果能够做到这一点，那当然是件好事。
1个回答
两个选项：
-
您可以使用
import mui from 'material-ui'导入所有内容。然后使用mui.Card、mui.CardActions等访问各个组件。这将使您的应用程序包比单独导入每个组件（具体取决于您使用的所有组件的哪一部分）更大，但从开发角度来看这是最方便的。 -
在您的项目中创建一个单独的文件，在其中导入您单独使用的每个组件，然后将它们全部导出到单个命名空间下。
例如，在您的通用文件中，您将有如下行：
import Card from 'material-ui/lib/card/card';
import CardActions from 'material-ui/lib/card/card-actions';
import CardHeader from 'material-ui/lib/card/card-header';
...
export default {
Card, CardActions, CardHeader,...
}
然后，您可以将该文件批量导入到您需要它的每个地方。这将产生一个与您现在所做的大小相同的包。在开发过程中，它不如选项 1 方便，但仍然比在每个自己的文件中都有单独的导入列表更方便。
Larry Maccherone
2016-04-11