require.js

RequireJS 是一个JavaScript模块加载器，非常适用在浏览器中使用。

引入库

其中script标签的data-main属性表示入口文件的引入路径

<script data-main="js/main.js" src="./js/require.js"></script>

require.js三板斧：require define require.config

• require: 调用模块
• define: 定义模块
• require.config: 配置模块

require:

// 第一个参数依赖的模块，第二个为回调函数
// 注意：a.js表示相对于html文件的路径，写a是相对于script标签的data-main定义文件的相对路径
// 回调函数参数表示a，b模块返回的对象
// requirejs AMD规范，提前把要依赖的模块家载好，再执行后面的回调
// seajs  CMD规范，不需要提前执行，顺序执行加载（即使用到的时候执行加载）
require(['a', 'b'], function(a, b) {
    console.log(a.sum(2, 5));
    console.log(b.mult(2, 5));
});

define:

// a.js
define(function() {
    function sum(a, b) {
        return a+b;
    }

    return { // return 表示暴露给外面的对象
        sum : sum
    };
});
// b.js
define(function() {
    function mult(a, b) {
        return a * b;
    }

    return {
        mult : mult
    };
});

require.config:

require.config({
    baseUrl : 'js', // 根目录
    paths: {
        tools: ['libs/tools'] // 定义模块名与模块文件的映射关系，也可以设置数组，前面如果找不到就找后面的，一般用户cdn的备选方案
    }
})

require(['a', 'b', 'tools'], function(a, b, tools) {
    console.log(a.sum(2, 5));
    console.log(b.mult(2, 5));
    console.log(tools.sayHello('Jack'));
});

// libs/tools.js
define(function() {
    function hello(name) {
        return 'hello ' + name + ' !';
    }

    return {
        sayHello: hello
    };
})