是否可以使用通配符从目录中的所有文件导入模块？

Question

使用ES6，我可以从以下文件导入多个导出：

import {ThingA, ThingB, ThingC} from 'lib/things';

但是，我喜欢每个文件有一个模块的组织。我最终得到了这样的导入：

import ThingA from 'lib/things/ThingA';
import ThingB from 'lib/things/ThingB';
import ThingC from 'lib/things/ThingC';

我很想能够做到这一点：

import {ThingA, ThingB, ThingC} from 'lib/things/*';

或者类似的东西，可以理解为每个文件包含一个默认导出，每个模块的名称与其文件相同。

这可能吗？

Answer 1

目前的答案提出了一个解决办法，但我对为什么不存在这个问题感到困惑，所以我创建了一个babel插件来实现这一点。

使用以下方式安装：

npm i --save-dev babel-plugin-wildcard

然后将其添加到您的.babelrc，方法是：

{
    "plugins": ["wildcard"]
}

有关详细安装信息，请参阅repo

这允许您这样做：

import * as Things from './lib/things';

// Do whatever you want with these :D
Things.ThingA;
Things.ThingB;
Things.ThingC;

同样，repo包含关于它具体做什么的更多信息，但这样做可以避免创建index.js文件，也可以在编译时进行，以避免在运行时执行readdirs。

此外，对于较新版本，您可以完全按照您的示例执行：

 import { ThingsA, ThingsB, ThingsC } from './lib/things/*';

工作原理与上述相同。

Answer 2

只是答案中已经提供的主题的一个变体，但是这个呢：

在一个东西中，

export default function ThingA () {}

在things/index.js中，

export {default as ThingA} from './ThingA'
export {default as ThingB} from './ThingB'
export {default as ThingC} from './ThingC'

然后把其他地方的东西都吃掉，

import * as things from './things'
things.ThingA()

或者只是消费一些东西，

import {ThingA,ThingB} from './things'

Answer 3

我认为这是不可能的，但是模块名称的解析取决于模块加载器，因此可能有一个加载器实现支持这一点。

在此之前，您可以使用位于lib/things/index.js的中间“模块文件”，该文件只包含

export * from 'ThingA';
export * from 'ThingB';
export * from 'ThingC';

它会让你做

import {ThingA, ThingB, ThingC} from 'lib/things';