RequireJS - 个人小入门

quirejs : http://www.requirejs.cn/

叶小钗  : http://www.cnblogs.com/yexiaochai/p/3214926.html

 

app.js 展示：

//<script data-main="js/app.js" src="js/require.js"></script> 页面引入;

requirejs.config({
    baseUrl: 'js',                                  // 所有模块的查找根路径;
    paths: {                                        // 快捷路径;
        js  : 'js',  
        logo: 'logo',
        lib : 'lib'
    },
     shim: {                                        // 声明依赖关系;
          'jquery.fixedHead': {                      //插件的名字;
            deps: ['jquery'],                       //需要加载的依赖项的数组;
            exports: 'fixedHead',                   //自己写的小插件的别名，需要依附于Jquery;
            init :function (bar) {                  //承接库加载后的初始工作,说白了就是处理插件没有define包成块的模块;
                return this.fixedHead.noConflict();
            }
        }
     },
     map: {                                         //用来解决同一个模块的不同版本问题;
        'A': {
            'jquery': 'jquery-1.6.4'
        },
        'B': {
            'jquery': 'jquery-1.7.2'
        }
    },
     scriptType :'text/javascript;version=1.8',    //指定RequireJS将script标签插入document时所用的type=""值;
     context : ['footer']                          //指定要加载的一个依赖数组;
});

//常用也就这些;

requirejs(['lib/jquery-1.8.3.min','logo/logo','fixed-head'],
function   ($,logo) {
  
});

logo.js 展示：

define(['lib/head','index'],function(head,index) {   //依赖注入到模块     
    var headJson = head;

     var cssUrl = require.toUrl("../css/base.css"); //生成相对于模块的URL地址;
     console.log(cssUrl);                   //执行这个地址;
     console.log( headJson.h );            //执行lib/head.js 里的h方法;

     return {                           // 对外输出的方法;
        show : function(){
            alert('你就没登陆');
        }
     }
        
});

requirejs 模块可以转成commonjs 模块

head.js 展示:

define(function(require, exports, module) {

    var c = require('../common');
    
    console.log( c.aa() );

    return {
       h : 'head.js'
    }

});

common.js 代码展示:

define(function(require, exports){
    exports.aa = function(){
        
        return 'common.js';

    }
});

后记：

注意初始化的 baseUrl 根目录的位置，剩下都和 sea.js差不多 还能转化成sea.js。