前言
js模块化编程之彻底弄懂CommonJS和AMD/CMD!这篇文章写的很清楚有关es5之前的模块化。
es6 Module 的语法
重点
1、es6模块设计解决了es5中AMD和CMD的加载痛点
- ES6 模块不是对象,而是通过export命令显式指定输出的代码,再通过import命令输入。
1
2// ES6模块
import { stat, exists, readFile } from 'fs'; - 上面代码的实质是从fs模块加载 3 个方法,其他方法不加载。这种加载称为“编译时加载”或者静态加载,即 ES6 可以在编译时就完成模块加载效率要比 CommonJS 模块的加载方式高。当然,这也导致了没法引用 ES6 模块本身,因为它不是对象。
2、es6中增加了import(),类似node中的require。
import()有以下优点:
- 按需加载
- 条件加载
- import()允许模块路径动态生成。
3、export 和 export default的区别
- export 后面跟的接口(我理解为对象): export {fun1,fun2}
- export default 跟着是变量:export default fun1
4、支持情况
目前node和浏览器基本上对es6的import和export不是很友好。具体参考了cnode社区的期待已久 Nodejs 开始支持 ES6 模块但是看起来很蛋疼。
所以还是得用类似webpack的工具进行转义。