自动导入具有相同文件后缀的模块答案

【问题标题】：Automatically import modules with the same file suffix自动导入具有相同文件后缀的模块
【发布时间】：2018-07-06 13:44:25
【问题描述】：

我目前正在设置我的 Redux 商店并导入许多不同的 reducer 文件。这开始看起来很乱，想知道是否有办法导入具有相同文件后缀的所有模块。所以目前...

import reducerOne from '../fileOne/one.reducer.js;
import reducerTwo from '../fileTwo/two.reducer.js;
import reducerThree from '../pathThree/fileThree/three.reducer.js;
import reducerFour from '../four.reducer.js;
import reducerFive from './five.reducer.js;
import reducerSix from '../longPathSix/pathSix/fileSix/six.reducer.js;
import reducerSeven from '../pathSeven/seven.reducer.js;

当每个文件路径不同时，有没有一种方法可以导入所有“reducer.js”文件，而不是手动单独导入每个模块？

【问题讨论】：

import modules from files in directory的可能重复
对不起，让我把它写得更详细一点@Shilly
同一个问题不是吗？答案是不。您要么创建一个中间文件，该文件导入列表并再次将其作为方法导出，因此您可以将其写在一个语句中。或者通过使用允许您在导入语句中使用通配符的 babel 插件。
好吧酷，所以 babel 是我的答案？这有助于谢谢你@Shilly
babel 插件或者制作中间文件。我会在下面发布。

标签： javascript reactjs import module redux

【解决方案1】：

如重复问题中所写：

如果你创建一个额外的文件 reducers.js，使用这个定义：

import reducerOne from '../fileOne/one.reducer.js;
import reducerTwo from '../fileTwo/two.reducer.js;
import reducerThree from '../pathThree/fileThree/three.reducer.js;
import reducerFour from '../four.reducer.js;
import reducerFive from './five.reducer.js;
import reducerSix from '../longPathSix/pathSix/fileSix/six.reducer.js;
import reducerSeven from '../pathSeven/seven.reducer.js;
export {
  reducerOne,
  reducerTwo,
  reducerThree,
  reducerFour,
  reducerFive,
  reducerSix,
  reducerSeven
};

然后你可以在你的主文件中使用它：

import { reducerOne, reducerTwo, reducerThree, reducerFour, reducerFive, reducerSix, reducerSeven } from '../reducers.js';

您基本上将所有减速器“捆绑”到一个只有一个路径的文件中。而且由于它的语法很少，因此自动创建这样一个文件是微不足道的。

【讨论】：