ES6 在索引文件中导出/导入

javascript ecmascript-6 babeljs webpack

2022-08-30 00:17:18

我目前正在通过webpack/babel在React应用程序中使用ES6。我正在使用索引文件来收集模块的所有组件并导出它们。不幸的是，这看起来像这样：

import Comp1_ from './Comp1.jsx';
import Comp2_ from './Comp2.jsx';
import Comp3_ from './Comp3.jsx';

export const Comp1 = Comp1_;
export const Comp2 = Comp2_;
export const Comp3 = Comp3_;

所以我可以从其他地方很好地导入它，如下所示：

import { Comp1, Comp2, Comp3 } from './components';

显然，这不是一个很好的解决方案，所以我想知道，是否有任何其他方法。我似乎无法直接导出导入的组件。

答案 1

您可以轻松地重新导出默认导入：

export {default as Comp1} from './Comp1.jsx';
export {default as Comp2} from './Comp2.jsx';
export {default as Comp3} from './Comp3.jsx';

还有一个关于~~ES7~~ ES8的建议，可以让你写。export Comp1 from '…';

答案 2

另外，请记住，如果您需要一次导出多个功能，例如您可以使用的操作

export * from './XThingActions';