模块化:require.js及r.js基础

require js的基本配置文件格式如下:

    requirejs.config({
      baseUrl: "src/js",  
      paths: {
        'jquery': 'lib/bower_components/jquery/dist/jquery.min'
      }
    });

baseUrl作用:给后续所引用的模块自动添加一个前缀,也就是说后续所引用的模块的地址是在此url基础上加引用时的小部分路径构成的。
baseUrl的基准:以引用config的那个html文件的所在目录为基准。
paths的作用:为一些跨baseUrl目录在当前目录下路径较长的模块做路径设置,在引用有设置paths的模块时,会用baseUrl+paths作为路径去获取模块。
paths的用法:例如,大部分模块在module中,而我的jquery因为分类是库,所以放在lib下了,此时baseUrl兼顾大众需求设为'js/module',而对于jquery因为不在module下所以我在paths中单独给它设路径为'../lib/jquery'

requirejs.config({
    baseUrl:'js/module',
    paths:{
        jquery:'../lib/jquery'
    }
});

r.js 的打包配置文件格式如下:

({
    baseUrl: "./src/js",
    paths: {
        'jquery': 'lib/bower_components/jquery/dist/jquery.min'
    },
    name: "main",
    out: "dist/js/merge.js"
})

baseUrl:这个baseUrl是基础路径,它的任务是搭配paths或下方name、out的路径来找到对应的模块、解析起始点(即name)、输出位置(即out),它是以自身所在目录为基准的。
name:是解析入口,搭配上面的baseUrl拼接出路径,拼接出的路径要指向require.js的配置文件;图中的解析入口就是"./src/js/main.js",从main.js开始解析打包。

你可能感兴趣的:(模块化:require.js及r.js基础)