组件开发流程

模块化

commonjs

require()
module.exports = {}

• 后端语法，没办法运行在浏览器端

AMD (Asynchronous module definition)

类似commonjs的格式 ，layui

• 采用异步加载方式
• 仅仅需要全局定义define和require，不需要其他的全局变量
• 通过文件路径或自己声明的模块定位模块
• 提供打包工具自动合并依赖
• 需要配合AMD加载器，比较有名是RequireJS，阿里的sea.js（CDM）
• 衍生出CMD

define(function(require) {
// 引入
  require();
  // 导出
  return {}
})

ES Module

官方提供的规范，大一统
export import方式

缺点是不是所有浏览器都支持
因此诞生了bundler

bundler 打包工具

将浏览器不支持的模块进行编译、转换，合并最后生成的代码可以在浏览器良好的执行的代码

包括：webpack、rollup

rollup

rollup main.js --file bundle.js --format iief