В настоящее время я использую 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';
Очевидно, это не очень приятное решение, поэтому мне было интересно, если бы был другой способ. Кажется, я не могу напрямую экспортировать импортированный компонент.
Вы можете легко экспортировать импорт по умолчанию:
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 '…';.
Кроме того, имейте в виду, что если вам нужно экспортировать сразу несколько функций, например, действия, которые вы можете использовать
export * from './XThingActions';
Слишком поздно, но я хочу поделиться тем, как я его разрешаю.
Имея файл 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/';
У меня была проблема с export *, она вернула undefined, когда я бы импортировал функцию/класс по умолчанию...
Итак, я наконец исправил его с помощью export {default} from './MyClass', и он также работал