Named exports
代码实现
export const key = 'this-is-a-secret';
使用样例
import { key } from 'environment';
- Named exports use a name.
- A module can have any number of named exports.
- Import and export name should be the same.
- Importing requires
{}
.
Default exports
const environment = {
key: 'this-is-a-secret',
port: 8000
};
export default environment;
import environment from 'environment';
const { key, port } = environment;
- Default exports expose a default value, use the
default
keyword.
- A module can only have one default export.
- Import name can be anything.
- Importing does not require
{}
.
Default + named
export const envType = 'DEV';
const environment = {
key: 'this-is-a-secret',
port: 8000
};
export default environment;
import { envType }, environment from 'environment';
const { key, port } = environment;
- Default and named exports can be mixed.
- Rules about number of exports and naming conventions apply as before.
- Import rules apply as before, can be mixed if necessary.
Export list
const key = 'this-is-a-secret';
const port = 8000;
export {
key,
port
};
import { key, port } from 'environment';
- An export list is a compact way to write multiple named exports.
- Rules about number of exports, naming conventions and import rules are the same as those of named exports.
- Export lists are not objects.
Rename export
const key = 'this-is-a-secret';
export { key as authKey };
import { authKey } from 'environment';
- Named exports can make use of the
as
keyword to rename an export.
- Import name should be the same as the renamed export.
Rename import
export const key = 'this-is-a-secret';
import { key as authKey } from 'environment';
- Named imports can make use of the
as
keyword to rename an import.
- Import name (before the
as
keyword) should be the same as the export.
Import all
export const envType = 'DEV';
const environment = {
key: 'this-is-a-secret',
port: 8000
};
export default environment;
import * as env from 'environment';
const { default: { key, port}, envType } = environment;
- Use
*
to import everything a module exports.
- Named exports will be available by their names on the imported object.
- Default export will be available as the
default
key on the imported object.
翻译自:https://www.30secondsofcode.org/js/s/module-cheatsheet