1. Introduction to ES6 modularity
The ES6 modular specification is a common modular specification for browsers and servers. With the emergence of ES6 modularity, front-end developers no longer need to learn additional modular specifications.
2. Defined in the ES6 modular specification:
1. Each js file is an independent module
2. Use the import keyword to import other module members
3. Use the export keyword to share module members externally
3. Import and export by default
Default export syntax: export default members exported by default
Default import syntax: import accepts name from 'path to module'
Notice:
In each module, there can only be one export default, otherwise an error will be reported.
The receiving name of the imported grammar can be legal and reasonable.
4. Import and export on demand
On-demand export syntax: export Members that need to be exported on demand
Import syntax on demand:
Basic syntax: import {name of on-demand import} from 'path to module'
Import multiple: import {name 1 to import on demand, name 2 to import on demand.....} from 'module path'
Aliasing: import {the name you need to import as your own alias} from 'module path'
Batch import: import * as an alias from 'module path'
Notice:
1. Each module can be exported multiple times on demand
2. On-demand export without default
3. The member name imported on demand must be consistent with the name exported on demand
4. When the module names exported by different components are the same, we want to import them in the same file. We can alias one of them to distinguish and avoid conflicts. Use the as keyword to alias (import exported name from "alias" path ")
5. When using batch export, you must use an alias as as, otherwise it will not work
Summarize:
1. On-demand import and export can be used together
2. When only one member is exported in the file, the default export is usually used (not forced)
3. When only multiple members are exported in the file, the on-demand export is usually used (not forced)
Five, direct import
No one needs to use it, just like executing the code in a module can be imported directly
import "path"
Note: There is no name, no form import and direct call
