javascript - Javascript如何在组内导出模块

我在文件夹ux中有几个React组件作为一个库（下面有一些标题）：

import MessageBar from "./atoms/MessageBar/MessageBar";
import Spinner from "./atoms/Spinner/Spinner";
import Button from "./atoms/Button/Button";
import AccordionHeader from "./molecules/AccordionHeader/AccordionHeader";
import AutocompleteList from "./molecules/AutocompleteList/AutocompleteList";
import ButtonGroup from "./molecules/ButtonGroup/ButtonGroup";
import LoginPanel from "./organisms/LoginPanel/LoginPanel";
import WelcomePanel from "./organisms/WelcomePanel/WelcomePanel";

我希望导出这些对象，以便可以从其组中导入它：

import LoginPanel from "ux.organisms";

要么

import Button from "ux/atoms";

管他呢。

这个想法是您要从ux库中的特定组获取元素。

建议的将所有这些组件导出（分组为（atoms，molecules，organisms等）的组件）的方式是什么？

PS：

一个。我不愿意更改组件名称（ButtomAtom等）

b。结果将是一个由其他项目导入的npm库。因此，此代码将驻留在我的ux/index.js文件中。

最佳答案

然后在index.js处创建一个ux/atoms/文件，并用以下文件填充：

import MessageBar from "./MessageBar/MessageBar";
import Spinner from "./Spinner/Spinner";
import Button from "./Button/Button";
//...

export { MessageBar, Spinner, Button };

因此，现在可以做到：

import { MessageBar } from "ux/atoms";

或者，如果您需要每个子模块：

import * as Atoms from "ux/atoms";

关于javascript - Javascript如何在组内导出模块，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49285486/