javascript - 是否可以使用 ES6/Babel 进行多个类导入？

Question

我正在开发一个 React 项目(我的第一个项目)，最近我重组了我的文件夹结构以使其更有意义。

为了让我的生活更轻松，在我的组件文件夹中，我有一个 index.js 文件，如下所示:

export * from './App';
export * from './Home';
export * from './PageWrapper';

(这个想法是从另一个 StackOverflow Question 借鉴的)

在这种情况下，该索引指向的每个文件都有一个单一的类导出。

现在在我的主应用程序中，我尝试执行以下操作:

import {Home, App} from './containers/index';
//or
import Home from './containers/index';

没有任何效果。我发现如果我将它们全部分成直接指向正确文件的单独行，它就可以工作。

import Home from './containers/Home';
import App from './containers/App';

那么是否可以按照我的方式导入多个类，而我只是没有看到它？我是否需要将它们全部命名(App as App)？或者这只是一个强制限制？

Answer 1

您可以像这样导出:

import App from './App';
import Home from './Home';
import PageWrapper from './PageWrapper';

export {
    App,
    Home,
    PageWrapper
}

然后，您可以在需要的地方像这样导入:

import { App, PageWrapper } from './index' //or similar filename

...

您可以阅读有关 import 的更多信息和 export这里。我也回答过类似的问题here .