Экспорт/импорт ES6 в индексном файле

В настоящее время я использую ES6 в приложении React через webpack/babel. Я использую индексные файлы для сбора всех компонентов модуля и их экспорта. К сожалению, это выглядит так:

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

Ответ 3

Слишком поздно, но я хочу поделиться тем, как я его разрешаю.

Имея файл model, который имеет два имени export:

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/';

Ответ 4

У меня была проблема с export *, она вернула undefined, когда я бы импортировал функцию/класс по умолчанию...

Итак, я наконец исправил его с помощью export {default} from './MyClass', и он также работал