CODEWITHSUNDEEP
javascriptecmascript-6babeljses6-modules
Alexandre Demelas
Alexandre Demelas

Reputation: 4710

import statement returns module member as undefined

Module (./lib/myModule.js):

const X = 10;

export default { X }

Main module (./index.js):

Case 1:

import { X } from './lib/myModule'

console.log(X) // undefined

Case 2:

import myModule from './lib/myModule'

const { X } = myModule;

console.log(myModule.X) // 10
console.log(X) // 10

Why when using object matching notation returns X as undefined and importing full object the member keeps his value? What's wrong with first case?

I'm using Babel for transforming ES 6 code with preset-es2015.

Upvotes: 3

Views: 786

Answers (1)

Michał Perłakowski
Michał Perłakowski

Reputation: 92709

That's because the import statement doesn't use destructuring assignment. In the first case you're trying to import member X, which is not exported. In the second case, you're importing the default member and then extracting X from it using destructuring assignment.

In the first case Babel transforms the console.log() line to this:

console.log(_myModule.X); // undefined

Whereas in the second case you get this:

console.log(_myModule2.default.X);

Upvotes: 4

Related Questions