导入语句和Babel

Question

我用keyMirrorFacebook 来定义两个常量fbjs.

// file1.js
import keyMirror from 'fbjs/lib/keyMirror'
export default keyMirror({
    CONST1: null,
    CONST2: null,
})

然后将它们导入file2.js:

// file2.js
import { CONST1, CONST2 } from './file1'
console.log(CONST1) // undefined

他们的价值观无法解决.如果我这样改变file2.js:

// file2.js
import constants from './file1'
console.log(constants.CONST1) // CONST1

它工作正常.它出什么问题了？我正在使用Babel 6 babel-preset-es2015来运行脚本.

Answer 1

您的导入不匹配,如果导出default导出,则必须导入default.如果要使用named导出导入,则需要使用named导出导出.

对于

import { CONST1, CONST2 } from './file1'

工作,你需要

export let {CONST1, CONST2} = keyMirror({
    CONST1: null,
    CONST2: null,
});

ES6模块语法中的{ CONST1, CONST2 }after import与解构无关,因此您不应将其视为从默认导出中拉出属性.相反,将其视为要从模块导入的名称列表.

你的解决方案可能适用于Babel 5,但它仍然无效,即便如此.您可以看到这个答案,以获得更多解释.

每个ES6模块都会导出一组导出,default为简单起见,它们是特殊的.

import constants from './file1';

是的缩写

import {default as constants} from './file1';

和

export default keyMirror({
    CONST1: null,
    CONST2: null,
})

基本上是短暂的

var temp = keyMirror({
    CONST1: null,
    CONST2: null,
});
export {temp as default};