1. ホーム
  2. ジャバスクリプト

[解決済み】インデックスファイルでのES6エクスポート/インポート機能

2022-04-04 23:44:44

質問

現在、Reactアプリでwebpack/babel経由で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';

もちろん、これはあまり良い解決策ではありませんが、他に方法はないかと考えていました。インポートしたコンポーネントを直接エクスポートすることはできないようです。

どのように解決するのですか?

デフォルトのインポートを簡単に再出力することができます。

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 '…'; .