RequireJS配置项笔记

摘要：读不顺中文文档，对应中文文档，自行翻译的如果有问题错误，欢迎指点修改配置选项方法一在顶级页面或顶级脚本文件没有定义模块的脚本文件中配置方法二在主模块中配置缺点主模块异步加载，多入口的话，会随机报错方法三在调用之前，将配置定义为全局变量配置在

读不顺中文文档，对应中文文档，自行翻译的……如果有问题/错误，欢迎指点；

修改配置选项：

方法一、
    
    
    
方法二、
    在主模块中配置；
        缺点：主模块异步加载，多入口的话，会随机报错；
        
方法三、
    
    
    

支持的配置选项：

baseUrl:模块查找的根路径；

    //目的：不必在重复相同的上级路径，只需考虑引用基路径下的哪个脚本
    //注意：只要以相对路径设置baseUrl，是相对于引用requireJS的HTML位置，而不是相对于main.js
      require.config({
        baseUrl: "/another/path"
      });
      
    以下路径文件不会基于baseUrl查找：*.js    /**    http://...
    默认值：不设置该属性的话，默认是加载require.js的HTML所在的位置；

paths:module ID & 路径映射

    //目的：不再使用路径调用脚本，而仅仅通过module ID调用；
    //针对于不在baseUrl/在baseUrl子孙文件下的模块进行映射；
    //路径映射最后一节应该是一个文件夹，而不是脚本文件；
    //映射是基于baseUrl的，除非以‘/’或‘http://’开始;
  require.config({
    baseUrl: "/another/path",
    paths: {
        "some": "some/v1.0",
        "others":["http://files...","location/files"]
    }
  });
    /*属性值为键/值对:    键表示module ID  值为路径/路径列表
    *（路径列表为数组，当第一项获取不到的时候，加载第二项...）
    *路径列表中，文件地址指向的是同一文件，只是做备选；
    */
    /*
    *如果paths属性的值中的路径脚本文件有自有名，该值的键名的值为undefined，而不是该脚本文件；
    *只能通过自有名来引用该路径的脚本文件；
    */

注意：一些命名的第三方库（如jquery），不能给它改名，键名不能设置jquery以外的名字，否则找不到jquery库；

map：调用模块文件 & 模块映射------适用于不同模块调用不同版本的脚本；

    //目的：不再使用路径调用脚本，而仅仅通过module ID调用；
    //只应用于真正的AMD模块---调用define()定义并匿名的模块
    //map属性只能用纯module IDs作为键名------纯module IDs?----------------以paths键名开始的路径？
    //构建优化不会破坏map配置，即构建后仍然可用；
    requirejs.config({
        map: {
            "*": {
                "foo": "foo1.2"
            },
            "some/newmodule": {
                "foo": "foo1.2"
            },
            "some/oldmodule": {
                "foo": "foo1.0"
            }
        }
    });

//抱怨下，map我理解的官文是调用不同的模板，但对jquery不行……
如果要引用不同版本的jquery，请看这里

bundles:配置一个脚本文件中的多个模块------未实践

    //目的：将一个脚本中的多个模块暴露出来，使其可以直接被require()；
    //推荐一个脚本文件一个模块；
    //一个脚本文件一个模块，模块会自动绑定到module ID上；
    *一个脚本多个模块，模块需要手动的将模块名绑定到module ID上；
    requirejs.config({
        bundles: {
            "primary": ["main", "util", "text", "text!template.html"],
            "secondary": ["text!secondary.html"]
        }
    });
    //Note that the keys and values are module IDs, not path segments.
    

shim:兼容不能用define()来声明依赖的传统“浏览器全局”脚本

    /*
    *按我理解：
    *不兼容define()，不符合AMD规范，没有像define()一样，最终return 对象/函数；
    *所以需要用shim将其中的某个全局变量exports给requirejs，才能被define()和require()引用；
    *
    *如果需要暴露多个全局变量，就不能用exports，而用init函数
    *init:function(){

return{

}

   *}
   */
   //仅仅起到声明依赖关系的作用，但不会加载依赖-----可以理解为shim只说不做；
   //如果要加载shim指定的依赖，仍需要require()/define()调用；
   //要求RequireJS2.1.0以上版本
   //RequireJS有wrapShim build 属性能自动包裹shimmed code在define()中升级为AMD，但不保证能正常执行；
   requirejs.config({
       /*
       *shim只能应用到非AMD规范的脚本文件上；
       *应用到符合AMD规范的脚本文件上不起作用；
       */
       shim: {
           /*
           *shim属性值为键/值对：键值为module ID；
           *如果backbone、underscore、foo在baseUrl文件中，则不需要paths配置；
           *否则，使用paths配置   值（文件路径）  到   键名
           */
           "backbone": {
               /*
               *deps声明依赖关系；
               *deps的值只能是非AMD规范的脚本或者“没有依赖关系且建立全局变量后调用define()的AMD库”；
               *如果shim用AMD模块作为依赖的话，会有错误发生--------因为shim对符合AMD规范的脚本不起作用；
               */
               deps: ["underscore", "jquery"],
               //将backbone传统脚本的Backbone函数暴露出来，类似于define()中的return；
               exports: "Backbone"
           },
           "underscore": {
               exports: "_"
           },
           "foo": {
               deps: ["bar"],
               exports: "Foo",
               init: function (bar) {
                   //初始化传统脚本；
                   return this.Foo.noConflict();
               }
           },
           //像jQuery插件不需要暴露任何全局变量，则只需声明依赖即可；
           //若要判断脚本是否被加载，需要声明exports
           "jquery.scroll":["jquery"]
       }
   });

那么，怎么知道暴漏什么属性、对象或者方法呢？
哈哈，我的做法是，看源码最后一行--------一般看return什么就根据需要暴漏什么；

config:设置application级别的配置信息；-------未实践

   //config的属性值为键/值对；
   requirejs.config({
       config: {
           "bar": {
               size: "large"
           },
           "baz": {
               color: "blue"
           }
       }
   });
   define(function () {
       //在模块中作为module.config()的属性来读取配置信息；
       var size = module.config().size;
   });
   //将配置信息传递给一个包package
   requirejs.config({
       //Pass an API key for use in the pixie package"s
       //main module.
       config: {
           "pixie/index": {
               apiKey: "XJKDLNS"
           }
       },
       //Set up config for the "pixie" package, whose main
       //module is the index.js file in the pixie folder.
       packages: [
           {
               name: "pixie",
               main: "index"
           }
       ]
   });
   

nodeIdCompat:node module ID兼容-------未实践

   //Node中认为模块ID  example.js和example是相同的------通过设置true认为是不同的；
   //而在RequireJS中，example.js和example是不同的
   require.config({
       nodeIdCompat:true    //如果通过npm加载模块的话，需要设置为true-----只对‘.js’后缀起作用；
   })
   

waitSeconds:设置超时时间；-------未实践

   //目的：设置加载脚本超时时间，超时后放弃加载；
   //默认7s；
   //设置0禁止超时；
   require.config({
       waitSeconds:0
   })
   

deps:在require.js加载之前，定义全局对象require设置依赖环境-------未实践

callback:在deps加载完成后执行的程序-------未实践

enforceDefine:严格define()或shim exports -------未实践

   require.config({
       enforceDefine:true    //设置为true-----加载的脚本必须是通过define()定义或者配置shim有exports值，否则抛出错误；
   })
   

xhtml：创建script元素-------未实践

   require.config({
       xhtml:true    //设置为true-----调用document.createElementNS()创建script元素；
   })
   

urlArgs:本地开发环境应对强缓存方案；-------未实践

   //添加额外的查询字符串到RequireJS获取资源的URLs上；
   //部署代码的时候要确保删除此配置；
   requirejs.config({
       //module ID和URL作为参数；
       urlArgs: function(id, url) {
           var args = "v=1";
           if (url.indexOf("view.html") !== -1) {
               args = "v=2"
           }
       //返回字符串添加到URL的后面；
           return (url.indexOf("?") === -1 ? "?" : "&") + args;
       }
   });
   

scriptType:设置脚本type属性-------未实践

   requirejs.config({
   //RequireJS添加的script标签type默认为‘text/javascript’；
       scriptType: ‘text/javascript;version=1.8’   
   });
   

skipDataMain:忽略 data-main属性；-------未实践

   requirejs.config({
   //设置为true，跳过data-main属性扫描加载模块；
   //如果两个加载RequireJS的程序有嵌套关系，被嵌套的不应该有data-main属性？？？？？？？没懂
       skipDataMain: true   
   });
   

疑问：求各位大神解答

   哪些脚本符合AMD规范；
   哪些AMD库call define() after they also create a global (like jQuery or lodash)
   怎么用mainConfigFile build option来指定shim config
   怎么生成依赖关系表；
   map属性只能用纯module IDs作为键名------纯module IDs?----------------以paths键名开始的路径？
   bundles----Note that the keys and values are module IDs--------------values的module IDs是从哪来的，define("module IDs")??????
   context:怎么用
   package:怎么用
   skipDataMain：如果两个加载RequireJS的程序有嵌套关系，被嵌套的不应该有data-main属性？？？？？？？没懂