前言

最开始的js并没有模块化这么一说，是散乱的。为了解决这问题，先出现了commonjs规范的模块化。

目前的模块化标准包括commonjs、amd、cmd（不流行）、esm

使用

commonjs

  • 主要在node环境内使用，如果需要在浏览器环境使用需要全局安装browserify模块并且保存在开发环境的依赖中
    使用browserify 源路径 -o 目标路径进行打包

amd

require.config({
    baseUrl:'./js/02',
    paths:{
        math:'math',
        // jquery:'jquery'
    }
});
require(['math'/*,'jquery'*/],(math/*,$*/)=>{
    console.log(math.add(8,9));
    // $('body').css('background-color','green');
})

define(()=>{
    function add(){
        var total=0;
        for( let i of arguments ){
            total+=i;
        }
        return total;
    }
    return {add};  
});

cmd

define((require,exports,module)=>{
    exports.add=function(){
        var total=0;
        for( let i of arguments ){
            total+=i;
        }
        return total;
    }
});

define((require)=>{
    const math=require('./math');
    console.log(math.add(8,9,10));
});

esm

export function add(){
    var total=0;
    for( let i of arguments ){
        total+=i;
    }
    return total;
}

import { add } from './math';

console.log(add(5,6));

Javascript模块化编程（一）：模块的写法

Javascript模块化编程（二）：AMD规范

Javascript模块化编程（三）：require.js的用法

Module 的语法