JavaScript模块速查表
命名导出
```js [environment.js] export const key = 'this-is-a-secret';
```js [index.js]
import { key } from 'environment';
- 命名导出使用一个名称。
- 一个模块可以有任意数量的命名导出。
- 导入和导出的名称应该相同。
- 导入需要使用
{}
。
默认导出
```js [environment.js] const environment = { key: 'this-is-a-secret', port: 8000 };
export default environment;
```js [index.js]
import environment from 'environment';
const { key, port } = environment;
- 默认导出会暴露一个默认值,使用
default
关键字。 - 一个模块只能有一个默认导出。
- 导入的名称可以是任意的。
- 导入不需要使用
{}
。
默认 + 命名
```js [environment.js] export const envType = 'DEV';
const environment = { key: 'this-is-a-secret', port: 8000 };
export default environment;
```js [index.js]
import { envType }, environment from 'environment';
const { key, port } = environment;
- 默认导出和命名导出可以混合使用。
- 关于导出数量和命名约定的规则仍然适用。
- 导入规则与之前相同,如果需要可以混合使用。
导出列表
```js [environment.js] const key = 'this-is-a-secret'; const port = 8000;
```js [index.js] import { key as authKey } from 'environment';
- Import names can also be renamed using the `as` keyword.
- The new import name can be any valid identifier.
```js [index.js]
import { key as authKey } from 'environment';
- 使用
as
关键字可以重命名导入的内容。 - 导入的名称(
as
关键字之前)应与导出的名称相同。
导入全部内容
```js [environment.js] export const envType = 'DEV';
const environment = { key: 'this-is-a-secret', port: 8000 };
export default environment;
```js [index.js]
import * as env from 'environment';
const { default: { key, port}, envType } = environment;
- 使用
*
导入模块的所有导出内容。 - 命名导出将在导入的对象上按其名称可用。
- 默认导出将作为导入对象上的
default
键可用。