ESM： es6 module规范及其实现； -----> web统一的前端规范
ES6 模块的设计思想是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。
CommonJS 和 AMD 模块，都只能在运行时确定这些东西。
核心：
独立作用域的
export导出模块内数据 ---> export
import引入模块数据 ---> 静态：import 只能放在文件开头 引申： import()函数动态引入 ，返回 Module 对象
使用：
<script type = "module">
// 这段代码 当做一个模块使用
</script>
type = "module" 作用：
声明这是一个模块
具有独立的作用域
使用 严格模式 “use strict”
数据的导出： （es6 module 标准：web环境 和 nodejs环境 ）
export var a = 1; <<===========>> var a = 1; export { a };
export var obj = { a:1 } <<===========>> var obj = { a:1 }; export { obj }
export var funcName = function(){} <<===========>> var funcName = function(){}' export { funcName };
-----------------------------------------------------> export { 表达式 }
导出多个： export { a, b, c, d}
导出接口别名： export { a as s } s 是 a 的别名
导出默认接口： export default -----> export default var a = 1;
数据的引入：
import 先于模块内的其他模块执行( 会被js引擎静态分析)
import variable from “文件路径”
es6模块的实现是静态加载，import命令无法替代requrie的动态加载 -----> 提案中 引入了 import() 函数
静态加载： import
编译时加载
只能在顶层结构中，否则报错 （编译错误，放在动态语句中报错，如 if语句）
获取的是模块接口的引用
动态加载： import() ( 解决动态加载的问题)
运行时加载
import() 返回一个 Promise 对象
模块、非模块脚本都可以加载
导入的是一个 Module 对象, 当做 then 回调的参数
btn.onclick = async function(){
let cssModule = await import(“./m1.css”); // 返回一个promise 对象
let css = cssModule.default;
}
无关的补充：
commonjs规范：一个文件是一个模块，module函数，每个文件都是module的实例；module.exports 数据的导出
nodejs 的 require方法 是运行时加载的
import命令无法替代 require的动态加载功能 ---> import()来实现动态加载