默认导出与命名导出

• 默认导出
  对于导出内容的命名无关紧要，只要给定名称即可，但默认导出只有一个。
• 命名导出
  导入时，名称必须与导出的名称一致，可以导出多个。

这是默认导入：

// B.js
import A from './A'

仅当A具有默认导出时才有效：

// A.js
export default 42

在这种情况下，导入时分配的名称并不重要：

// B.js
import A from './A'
import MyA from './A'
import Something from './A'

因为它会始终解析到任何的是默认的导出的A。

这是一个名为import的导入A：

import { A } from './A'

仅在A包含名为的命名导出A时才有效：

export const A = 42

在这种情况下，名称很重要，因为您要通过其导出名称来导入特定内容：

// 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 = 42
export const myA = 43
export const Something = 44

一个模块只能具有一个默认导出，但可以具有任意数量的命名导出（零，一个，两个或多个）。您可以将它们全部一起导入：

// B.js
import A, { myA, Something } from './A'

在这里，我们将默认导出导入为A，并将导出名称分别命名为myA和Something。

// A.js
export default 42
export const myA = 43
export const Something = 44

导入时，我们还可以为它们分配所有不同的名称：

// B.js
import X, { myA as myX, Something as XSomething } from './A'

默认导出通常用于通常希望从模块中获取的内容。命名出口通常用于方便的实用程序，但并不总是必需的。但是，由您决定如何导出内容：例如，一个模块可能根本没有默认导出。