web-dev-qa-db-ja.com

ES6インデックスファイルでのエキスパート/インポート

私は現在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';

明らかにこれはあまり良い解決策ではないので、他に方法があるのであれば私は疑問に思いました。インポートしたコンポーネントを直接エクスポートできないようです。

javascriptecmascript-6webpackbabeljs
161
MoeSattler

デフォルトのインポートを簡単に再エクスポートできます。

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 '…';を書くことができます。

298
Bergi

また、アクションのように複数の関数を一度にエクスポートする必要がある場合は、次の点に注意してください。

export * from './XThingActions';
47
G. M.

遅すぎますが、解決方法を共有したいと思います。

Exportという名前の2つのmodelファイルがあります。

export { Schema, Model };

そしてデフォルトのエクスポートがあるcontrollerファイルを持っています：

export default Controller;

このようにしてindexファイルに公開しました。

import { Schema, Model } from './model';
import Controller from './controller';

export { Schema, Model, Controller };

それらすべてをインポートしたいとします。

import { Schema, Model, Controller } from '../../path/';
29
Javier Aguila

私はexport *に問題がありました、それは私がデフォルトの関数/クラスをインポートするときにundefinedwを返しました...

だから、私は最後にexport {default} from './MyClass'でそれを修正しました、そしてそれは同様に働きました

7
pirs