实践总结
在我项目的目录结构最外层有一个components文件夹，里面存放着项目用到的所有公共组件，每个页面用到这些组件时，便通过import方法导入相关组件。
但是当页面复杂后，且随着项目变大，这种使用import命令一次次导入组件的做法就显得非常繁琐不优雅了。比如我的某个文件:
import NavBar from '../../../components/NavBar';
import {FrameTextButton} from '../../../components/ButtonSet';
import StatePage from '../../../components/StatePage';
import ChooseBox from '../../../components/ChooseBox';
import InputScrollView from '../../../components/InputScrollView';
import ModalPassword from '../../../components/ModalPassword';
import AlertBox from '../../../components/AlertBox';
import ResultDetail from '../../../components/ResultDetail';
import ContractModal from '../../../components/ContractModal';
import IncomeRate from '../../../components/IncomeRate';
import DashedLine from '../../../components/DashedLine';
并且当组件开发的越来越多，components文件夹也越来越大，团队开发时，其他同事往往不知道你开发了什么组件，从而造成组件重复开发，使用率低等问题。
所以，为了解决以上问题，我对components模块进行优化。
整体思路是先按组件功能进行分块，比如button类，textInput类，image类等等，在components文件夹里再分文件夹；归类完成后，在components文件夹里创建一个index.js，里面通过import把所有公共组件导入，然后通过export把组件统一导出。这其实是引入RN中包的概念。目录大概如下：
|_components
|_buttons
|_textInput
|_image
|_index.js
外部使用如下：
import {
NavBar,
StatePage,
ChooseBox,
AlertBox,
ResultDetail,
ContractModal,
IncomeRate,
DashedLine
} from '../../../components/index';
然后在index.js中，对每个引入的组件写上注释，让后续开发的同事能在里面清晰的找到他需要的组件，达到一点面向文档开发的效果。
思考
解决完问题后，想到两个问题：
1、 由于index.js导入了所有的组件，然后其他页面使用时直接加载index.js，如果我只用到其中的一两个组件，那index.js中的其他组件会不会都加载了，如果真的加载了岂不是造成内存的浪费？
2、 RN中有require、exports、module.exports，还有import、export，这些都是一样的东西吗？
这两个问题请看我的下一篇文章《ES6模块(Module)加载知识总结（二）》
