前端模块化发展

模块化

模块化：是指将一个复杂的系统分解为多个模块。 以下几个常见的模块化规范。

CommonJS

用require同步加载依赖的其他模块，通过module.export导出需要暴露的接口。

//导入
const moduleA = require("./moduleA");
//导出
module.exports = moduleA.someFun;

CommonJs的规范流行得益于Node.js采用了这种方式。 CommonJS规范设计是为了服务端，而nodejs是服务端编程，因为文件在本地硬盘可以直接访问，所以不需要非同步方式加载，而浏览器需要向服务端加载。所以不需要这种方式。 需要用工具转换成标准的ES5

AMD

AMD与CommonJS最大不同之处是：采用异步的方式去加载依赖的模块。

//定义一个模块
define("module",['dep'],function(dep){
    return exports;
})
//导入和使用
require(['module'],function(module){
    
})

ES6模块化

逐渐取代了CommonJS和AMD规范。 缺点：无法直接运行在大部分JavaScript运行环境下，必须通过工具转换成标准的ES5才能正常运行。

//导入
import {readFile} from 'fs';
import React from 'react';
//导出
export function hello(){};
export default{}

《深入浅出Webpack》