How to export imported object in ES6?

ImportExportEcmascript 6

Import Problem Overview


The use case is simple: I just want to export an object with the name just as it was imported.

for example:

import React from 'react';
export React;

but this does not work. I have to write:

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

But this is odd. What is the right way to do this?

UPDATED:

Thanks for helps and references. I have solved out my problem with many clues. I'd like to share some common cases for me and the solutions.

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

export {obj, d};
export {obj as name1, d as name2};
re-export all named imports
export * from '...';
export * as name1 from '...';
re-export some named imports
export {a, b as name1} from '...';
re-export default import as default export
export {default} from '...';
re-export default import as named export
export {default as name1} from '...';

Import Solutions


Solution 1 - Import

I often do the following in index.js files that compose several files:

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

This blog entry provides some nice additional examples.

Important note

You should be aware this eslint-rule when accessing these exported imports. Basically, in another file, you shouldn't:

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

You should do this:

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

Solution 2 - Import

You could export imported file with such structure

import First from './First'
import Second from './Second'
/..../
export { First, Second }

Solution 3 - Import

For my use case, I explicitly need some sort of explicit import statement so that babel can transpile my es7 code to es5.

The following results in an error 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'

My solution was to explicitly import the module by using require():

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

Solution 4 - Import

Given ./foo.js:

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

export default Foo;

Then you should be able to do this:

import Foo from './foo';

let foo = new Foo();

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

The syntax more or less follows the commonjs module.exports pattern, where you would do this:

const Foo = class {

};

module.exports = Foo;

More here:

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

Solution 5 - Import

You should be able to do export {React} and import it via import {React} from ./module

See https://developer.mozilla.org/en/docs/web/javascript/reference/statements/export for more information.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionYao ZhaoView Question on Stackoverflow
Solution 1 - ImportEric H.View Answer on Stackoverflow
Solution 2 - ImportIgor DolzhenkovView Answer on Stackoverflow
Solution 3 - ImportKacyView Answer on Stackoverflow
Solution 4 - ImportRich ApodacaView Answer on Stackoverflow
Solution 5 - ImportsheeldotmeView Answer on Stackoverflow