javascript - 导入语句将模块成员返回为未定义

标签 javascript ecmascript-6 babeljs es6-modules

模块(./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 通过 preset-es2015 转换 ES 6 代码。

最佳答案

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

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

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

而在第二种情况下你会得到这个:

console.log(_myModule2.default.X);

关于javascript - 导入语句将模块成员返回为未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40056448/

相关文章:

javascript - 使用 babel-preset-env 将 polyfill 作为导入语句更好,还是将它们添加到 webpack.config.js 的条目中更好?

javascript - Babel CLI 引用错误 : regeneratorRuntime is not defined

gulp - 验证 : 'import' and 'export' may appear only with 'sourceType: module'

javascript - HTML中的相关参数

javascript - 为 JS 中的函数添加属性

javascript - 如何检查javascript数组是否包含具有特定值的属性,如果是则返回true

ecmascript-6 - es6从父类的静态方法访问子类的静态方法?

reactjs - 构建过程中的某些内容正在加载错误的版本

javascript - PHP Xpath JS 如何用 JS 从网站获取内容?

javascript - Mongoose 异步默认值