Como exportar objeto importado no ES6?

242

O caso de uso é simples: eu só quero exportar um objeto com o nome exatamente como foi importado.

por exemplo:

import React from 'react';
export React;

mas isso não funciona. Eu tenho que escrever:

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

Mas isso é estranho. Qual é a maneira certa de fazer isso?

ATUALIZADO :

Obrigado por ajuda e referências. Eu resolvi meu problema com muitas pistas. Gostaria de compartilhar alguns casos comuns para mim e as soluções.

importação e exportação

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

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

reexporte todas as importações nomeadas

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

reexporte algumas importações nomeadas

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

reexportar a importação padrão como exportação padrão

export {default} from '...';

reexporte a importação padrão como exportação nomeada

export {default as name1} from '...';
import export ecmascript-6 Yao Zhao
fonte
por que você exportaria reagir?
Omarjmh 13/05/2019
você pode, export {React}mas novamente, se precisar do React em algum lugar, basta importá-lo para lá.
Loganfsmyth 13/05/19
2
export react react é apenas um exemplo. Na verdade, quero organizar um projeto para que o usuário possa importar algum objeto no caminho mais curto e de alto nível.
Yao Zhao
Muito obrigado por essa atualização. Ele resolveu todos os problemas que tive com o ES6 / 7. Sugiro que você adicione isso como resposta e aceite-o.
Florian Wendelborn
12
export * as name1 from '...';isso não funciona para mim (usando o webpack 2). Alguma ideia?
Entidade Preto

Respostas:

131

Costumo fazer o seguinte nos arquivos index.js que compõem vários arquivos:

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

Esta entrada de blog fornece alguns bons exemplos adicionais.

Nota importante

Você deve estar ciente desta regra de exclusão ao acessar essas importações exportadas. Basicamente, em outro arquivo, você não deve:

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

Você deve fazer isso:

import SomeClassModule, {someFunction} from 'SomeClass/index.js';
someFunction(); // Ok
Eric H.
fonte
36

Você pode exportar arquivos importados com essa estrutura

import First from './First'
import Second from './Second'
/..../
export { First, Second }
Igor Dolzhenkov
fonte
2

Para o meu caso de uso, preciso explicitamente de algum tipo de instrução de importação explícita para que babel possa transpilar meu código es7 para es5.

O seguinte resulta em um erro 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'

Minha solução foi importar explicitamente o módulo usando require():

require( 'babel-core/register' );
export default require( './module_name' ).default;
Kacy
fonte
-1

Dado ./foo.js:

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

export default Foo;

Então você deve conseguir fazer isso:

import Foo from './foo';

let foo = new Foo();

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

A sintaxe segue mais ou menos o padrão commonjs module.exports, onde você faria isso:

const Foo = class {

};

module.exports = Foo;

Mais aqui:

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

Rich Apodaca
fonte
Não era bem disso que se tratava a pergunta?
Dan Dascalescu 17/10/19