2

Sometimes you want to combine these syntaxes, most often when importing something that uses the commonjs syntax. Some cases were already discussed for example here:

How to correctly use ES6 "export default" with CommonJS "require"?

but there surely are more situations that can occur!

Community
  • 1
  • 1
Tomas Kulich
  • 14,388
  • 4
  • 30
  • 35
  • 1
    This depends on the module syntax transpiler and the module loader or bundler that you use. You should be able to find everything in their docs. – Bergi Apr 19 '16 at 14:56

1 Answers1

3

As @Bergi and @Mike pointed in the comments, it is up to the transpiler (most commonly Babel), how it copes with ES6 import / export. Few examples, what you'll got with Babel (with its standard plugins):

CommonJS export, ES6 import

module.exports = 1    // a.js
import one from './a' // b.js
// one === 1

module.exports = {one: 1}  // a.js
import obj from './a'      // b.js
// obj is {one: 1}

import * as obj from './a' // b.js
// obj.one === 1 ; however, check out the 'funky stuff' below

import {one} from './a'    // b.js
// one === 1

ES6 export, CommonJS require

export default 1 // a.js
const one = require('./a').default
// one === 1

export const one = 1
const one = require('./a').one
// one === 1

Funky stuff

module.exports = 1          // a.js
import * as obj from './a'  // b.js
// obj is {default: 1}

module.exports = {one: 1}   // a.js
import * as obj from './a'  // b.js
// obj is {one: 1, default: {one: 1}}
Tomas Kulich
  • 14,388
  • 4
  • 30
  • 35