ES6 Module 导入与导出

• 主要罗列出最常用的几种用法, 知道这些用法你基本可以应付大多数的场景了

默认导出 与 默认导入

语法

export default { name, age, gender }
import person from '路径'

注意

1. 每个模块中, 只允许使用唯一的一次 export defult
2. export defult 后 不可以再写任何代码

按需导出 与 按需导入

语法

export let s1 = 'aaa'
export let s2 = 'ccc'
export function say() {}
<=> export { s1, s2, say }


import { s1, s2 as two, say} from '路径'

注意

1. 每个模块中可以使用多次按需导出
2. 按需导入的成员名称必须和按需导出的名称保持一致
3. 按需导入时, 可以使用 as 关键字进行重命名
4. 按需导入可以和默认导入一起使用

直接导入

• 如果只想单纯地 执行某个模块中的代码, 并不需要得到模块中向外共享的成员, 此时可以直接导入并执行模块代码 import './index.js'

导入并导入

• 在项目中, 有时你需要一个中转文件, 集中来处理导入与导出, 这时你可能会需要用到此语法

export default {name: 'NavBar'}

export { default as NavBar} from '路径' //导入并导出

• 当然, 你也可以用其它的方案代替, 只要方案可行