模块化

规范

• 浏览器模块化
  • AMD
  • CMD
• 服务端模块化
  • NODEjs
• ES6模块化

ES6模块化

• 安装babel

npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/nodenpm install --save @babel/polyfill

• 导出

// export default 只能用一次export { firstName, lastName, year };// 注意，导出的的变量为引用，实际上仍然可以受到原来模块的控制// 如果使用export default 导出的就是值而非引用export function multiply(x, y) {  return x * y;};

• 导入

import { stat, exists, readFile } from 'fs';// 一些混用import m1, {a as x,c} from './m1.js';// 直接指向导入模块的代码import './m2.js'export a from "a.js"

语法要求不带 as 的默认值永远在最前

脚本与模块

• 脚本：是可以由浏览器或者 node 环境引入执行的
• 模块：只能由 JavaScript 代码用 import 引入执行

现代浏览器可以支持用 script 标签引入模块或者脚本，如果要引入模块，必须给 script 标签添加 type=“module”