ES6, how can you export an imported module in a single line?

React NativeEcmascript 6Import

React Native Problem Overview


I'd like to the following but with a single line, if possible:

  • import Module from './Module/Module;'
  • export Module;

I tried the following but it doesn't seem to work:

  • export Module from './Module/Module;

React Native Solutions


Solution 1 - React Native

export {default as Module} from './Module/Module';

is the standard ES6 way, as long as you don't need Module to also be available inside the module doing the exporting.

export Module from './Module/Module';

is a proposed ESnext way to do it, but that only works if you've enabled it in Babel for now.

Solution 2 - React Native

I don't know why but just this works for me :

components/index.js:

import Component from './Component';
import Component2 from './Component2';
import Component3 from './Component3';
import Component4 from './Component4';

export {Component, Component2, Component3, Component4};

I import the exports like this :

import {Component, Component2, Component3, Component4} from '../components';

Solution 3 - React Native

Please note you can also re-export everything from a module:

export * from './Module/Module';

Solution 4 - React Native

For React Native components this syntax works for me:

export {default} from 'react-native-swiper';

Solution 5 - React Native

// Service
// ...
export const paymentService = new PaymentService()

// Entry services/index.js file
export * from './paymentService'

// use it like
import { paymentService } from './services/'

Solution 6 - React Native

So, I've found this to work quite well for the immediate export functionality of having an index.js at the root of the components directory for easy referencing:

import Component from './Component/Component'
import ComponentTwo from './ComponentTwo/ComponentTwo'

module.exports = {
  Component,
  ComponentTwo
};

You need to use module.exports.

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
QuestionDetunedView Question on Stackoverflow
Solution 1 - React NativeloganfsmythView Answer on Stackoverflow
Solution 2 - React NativeKamuran SönecekView Answer on Stackoverflow
Solution 3 - React Nativelaszlo-horvathView Answer on Stackoverflow
Solution 4 - React NativeIvan ChernykhView Answer on Stackoverflow
Solution 5 - React NativeelverdeView Answer on Stackoverflow
Solution 6 - React NativeDetunedView Answer on Stackoverflow