javaScript模块化

• commonJS

  • // 导入   const moduleA = require('./moduleA');

  • // 导出    module.exports = moduleA.someFunc;

  • 优点

    • node.js下可运行，

    • NPM发布很多的第三方模块采用commonJS 规范

  • 缺点

    • 无法在浏览器下直接运行，必须用工具转成ES5

• AMD--requirejs

  • // 定义一个模块

    • define('module', ['dep'], function(dep) {
           return exports;
      });

  • // 导入和使用

    • require(['module'], function(module) {
      });

  • 优点

    •  1、异步加载模块

    • 2、可在不转换代码的情况下直接在浏览器中运行；

    • 3、可并行加载多个依赖；

    • 4、代码可运行在浏览器环境和 Node.js 环境下

• ES6模块化

  • 浏览器厂商和 Node.js 都宣布要原生支持该规范

  • 它将逐渐取代 CommonJS 和 AMD 规范，成为浏览器和服务器通用的模块解决方案。

  • // 导入

    • import { readFile } from 'fs';         import React from 'react';

  • // 导出

    • export function hello() {};               export default {};

  • 缺点：

    • 目前无法直接运行在大部分 JavaScript 运行环境下，必须通过工具转换成标准
      的 ES5 后才能正常运行。

• 其他模块化语言

  • scss、less

    • @import ‘mix’

      • 抽离公共的部分，通过逻辑写出更灵活的代码

  • 新的框架

    • vue、angular、react