requirejs与seajs

AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。
CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。 

对于依赖的模块,AMD 是提前执行,CMD 是延迟执行

// CMD  
define(function(require, exports, module) {  
var a = require('./a')  
a.doSomething()  
// 此处略去 100 行  
var b = require('./b') // 依赖可以就近书写  
b.doSomething()  
// ...   
})  
  
// AMD 默认推荐的是  
define(['./a', './b'], function(a, b) { // 依赖必须一开始就写好  
a.doSomething()  
// 此处略去 100 行  
b.doSomething()  
...  
}) 

写法对比:

配置文件

require.config({
    baseUrl:'/js',  //根路径
    path:{
        'jquery':'./query.js',
        'bootstrap':'./bootstrap',
        'backone':'./backone',
        'modernizr':',.modernizr'
    },
    shim:{
        'modernizr':{
            exports:'modernizr'  //不支持amd
        },
        'bootstrap':['jquery']  //依赖
    },
    map:{
        '*':{
            'jquery':'./jquery1.2.4'    //默认版本
        },
        'jq2':{
            'jquery':'./jquery2.2.4'    //升级版本
        }
    },
    waitSecound:0,  //下载js等待时间默认7s,0为一直等待,否则报失败信息
})
seajs.config({
    //设置路径
    paths: {
        'gallery': 'https://a.alipayobjects.com/gallery'
    },
    // 设置别名,方便调用
    alias: {
        'underscore': 'gallery/underscore'
    },
    debug:false,
    // 文件编码
    charset: 'utf-8'
});

模块定义:

  //app.js   require
    define([],function(){
        var add = function(msg, callback) {
                        console.log(msg);
                        callback();
                      };
        return add;
    });
    //app.js   seajs
    define(function(require,exports,module){
        module.exports = {
            add : function(msg, callback) {
                console.log(msg);
                callback();
            }
        }
    });

使用模块:

  //requirejs
    define(['app'], function(app) {
        app.add("Hello World", function () {
            console.log("成功");
        });
    });
    //seajs
    seajs.use(['app'],function(app){
        app.add("Hello World", function () {
            console.log("成功");
        });
    })

 

posted @ 2017-12-01 10:30  梦雪web  阅读(115)  评论(0编辑  收藏  举报