如何组织从自己的 React 库中导出的组件答案

【问题标题】：How to organise exported components from own React library如何组织从自己的 React 库中导出的组件
【发布时间】：2019-02-14 01:41:37
【问题描述】：

我一直在开发一个可以在我的 React 项目中重用的组件库。如何以相关功能组的形式导出这些组件，以便使用我的库的项目的相应导入语句如下所示？

import { Select1, Select2 } from 'myLib/Selects';
import { Button1, Button2 } from 'myLib/Buttons';
import { List1, List2 } from 'myLib/Lists';

【问题讨论】：

【解决方案1】：

// Selects.js
export {
  Select1,
  Select2
}

// Buttons.js
export {
  Button1,
  Button2
}

// Lists.js
export {
  List1,
  List2
}

【讨论】：

当我尝试以这种方式导入组件时，我得到一个找不到模块的错误：Module not found: Error: Can't resolve 'lib.min/Buttons'。如果我有import { Button1 } from 'lib.min'，它就可以工作......
@Bergi 我正在尝试从捆绑的lib.min 导入，这是我在原始问题中所指的库。这目前有效：import { Button1 } from 'lib.min' 但我想让这项工作：import { Button1 } from 'lib.min/Buttons'
@CSharp 是的，只需在发布库之前放弃缩小和捆绑。改为提供多个文件，并让库的用户在部署整个应用程序时自己进行压缩和捆绑。
是的，如果（且仅当）您发布了 ES6 源代码，您的客户端使用的捆绑器/转译器将理解 ES6 导出语法。