es6之import { default as的用法
默认导出实际上是名为default的命名导出,default 是固定写法不能修改,as 后是你自己随意定义的新名称。
import {default as NAME} from './name.js'
import default默认导出和命令导出
// 默认导入 B.js
import A from './A'
只有 A具有默认导出时才有效:
//导出 A.js
export default 18
1、此时,导入时为其指定的名称无关紧要,
// B.js
import A from './A'
import MyA from './A'
import Something from './A'
因为它将始终解析为默认导出任何内容 A。
import { } 的用法
// 这是一个名为import的导入 A
import { A } from './A'
它仅在 A
包含名为的导出 A时才有效:
export const A = 18
2、在这种情况下,名称很重要,因为您通过其导出名称导入特定的东西:
// B.js
import { A } from './A' // 正确打开方式
import { myA } from './A' // Doesn't work!
import { Something } from './A' // Doesn't work!
要使这些工作,您可以将相应的命名导出添加到 A
:
// A.js
export const A = 18
export const myA = 19
export const Something = 20
一个模块只能有一个默认导出,但是你可以拥有多个命名导出(零,一,二或许多)。您可以将它们全部导入:
// B.js
import { A, myA, Something } from './A'
将默认导出导入为 A
,并分别命名为exports myA
和 Something
。
// A.js
export default 18
export const myA = 19
export const Something = 20
还可以在导入时为它们分配所有不同的名称:
// B.js
import X, { myA as myX, Something as XSomething } from './A'
默认导出实际上是名为default的命名导出,因此可以将默认导出导入为:
import {default as NAME} from './name.js'