import语句将模块成员返回为未定义

Question

模块（./lib/myModule.js）：

const X = 10;

export default { X }

主要模块（./index.js）：

案例1：

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

console.log(X) // undefined

案例2：

import myModule from './lib/myModule'

const { X } = myModule;

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

为什么当使用对象匹配表示法返回X为未定义并导入完整对象时，成员会保留其值？第一种情况有什么问题？

我正在使用Babel将{6}代码转换为preset-es2015。

Answer 1

那是因为import语句不使用解构赋值。在第一种情况下，您尝试导入未导出的成员X。在第二种情况下，您要导入默认成员，然后使用destructuring assignment从中提取X。

在第一种情况下，Babel将console.log()行转换为：

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

而在第二种情况下，你得到了这个：

console.log(_myModule2.default.X);