Как экспортировать импортированный объект в ES6?

244

Вариант использования прост: я просто хочу экспортировать объект с именем так же, как он был импортирован.

например:

import React from 'react';
export React;

но это не работает. Я должен написать:

import React from 'react';
export const React = React;

Но это странно. Как правильно это сделать?

ОБНОВЛЕНО :

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

экспорт импорт

import d, {obj} from '...';

export {obj, d};
export {obj as name1, d as name2};

реэкспорт всех названных импортов

export * from '...';
export * as name1 from '...';

реэкспорт некоторых именованных импортов

export {a, b as name1} from '...';

реэкспорт импорт по умолчанию как экспорт по умолчанию

export {default} from '...';

реэкспорт импорт по умолчанию как именованный экспорт

export {default as name1} from '...';
import export ecmascript-6 Яо Чжао
источник
почему вы должны реагировать на экспорт?
omarjmh
вы можете, export {React}но опять же, если вам нужен React где-то, вы должны просто импортировать его туда.
loganfsmyth
2
реакция на экспорт - всего лишь пример, на самом деле, я хочу организовать какой-то проект, чтобы пользователь мог импортировать какой-либо объект по более короткому пути и пути высокого уровня.
Яо Чжао
Большое спасибо за это обновление. Это решило все проблемы, которые у меня были с ES6 / 7. Я предлагаю вам добавить это в качестве ответа и принять его.
Флориан Вендельборн
12
export * as name1 from '...';это не работает для меня (с помощью веб-пакета 2). Любые идеи?
Entity Black

Ответы:

131

Я часто делаю следующее в файлах index.js, которые составляют несколько файлов:

export {default as SomeClass} from './SomeClass';
export {someFunction} from './utils';
export {default as React} from 'react';

Эта запись в блоге содержит несколько хороших дополнительных примеров.

Важная заметка

Вы должны знать это правило eslint при доступе к этим экспортированным импортам . По сути, в другом файле вы не должны:

import SomeClassModule from 'SomeClass/index.js';
SomeClassModule.someFunction(); // Oops, error

Вы должны сделать это:

import SomeClassModule, {someFunction} from 'SomeClass/index.js';
someFunction(); // Ok
Эрик Х.
источник
36

Вы можете экспортировать импортированный файл с такой структурой

import First from './First'
import Second from './Second'
/..../
export { First, Second }
Игорь Долженков
источник
2

Для моего случая использования мне явно нужны какие-то явные операторы import, чтобы babel могла перенести мой код es7 в es5.

Следующее приводит к ошибке You gave us a visitor for the node type "ForAwaitStatement" but it's not a valid type:

require( 'babel-core/register' ); //transpiles es7 to es5
export {default} from './module_name'

Мое решение состояло в том, чтобы явно импортировать модуль, используя require():

require( 'babel-core/register' );
export default require( './module_name' ).default;
Kacy
источник
-1

Дано ./foo.js:

const Foo = class {
  talk() { return 'hello'; }
};

export default Foo;

Тогда вы должны быть в состоянии сделать это:

import Foo from './foo';

let foo = new Foo();

foo.talk(); // => 'hello';

Синтаксис более или менее соответствует шаблону commonjs module.exports, где вы должны сделать это:

const Foo = class {

};

module.exports = Foo;

Больше здесь:

http://exploringjs.com/es6/ch_modules.html

Богатая Аподака
источник
Это не совсем то, о чем был вопрос?
Дан Даскалеску