初识requirejs(二)

requirejs还有很多不错的功能,但是可能不是非常常用,下面来介绍下这些功能:

1. map参数

map: {
        "new_aaa": {
            "ccc": "moudle/ccc/ccc1"
        },
        "old_aaa": {
            "ccc": "moudle/ccc/ccc2"
        },
        "*": {
            "ccc": "moudle/ccc/ccc3"
        }
    }

map的作用主要是方便用户配置同一模块的不同版本,比如网站有一部分改版了,需要升级到最新版的jquery,但是未改版的页面可能与最新版的jquery不兼容,还是需要使用老版本的jquery,这个时候就要用到map。

拿上面的代码举例,new_aaa为一个新开发模块,old_aaa为一个老的模块,*表示剩余的模块,三种模块都需要引用ccc模块,但是他们各自想要的ccc可能有点区别,所以他们各自引用不同的ccc,说到这里大家要觉得奇怪了,这样不是还是定义了三个ccc模块吗?一点都没有方便啊。事实果真如此吗? 非也非也。下面我来说说map的优势:

① 模块名统一,比如是jquery,那所有依赖jq的地方,都能直接["jquery"]而不用有些地方["jquery-1.10.1"],["jquery-1.7.1"]。

② 方便修改,比如我某个地方突然要有新版jq了,那直接config里修改一下就可以了,而不用特意找到要修改模块的地方去修改。

具体代码看demo吧

demo下载

2. packages参数

packages参数,看名字就知道,这个是用来配置包的。

packages在config里面是一个数组,其元素可以是字符串,也可以是一个对象。

packages: [
        {
            name: "kitty",
            location: "moudle/kitty",
            main: "kitty"
        },
        {
            name: "doggy",
            location: "moudle/doggy",
            main: "doggy"
        }
    ]
// 下面这种用法,location就默认是baseurl+packages的name了,main则默认是main.js
packages: ["kitty", "doggy"]
//上面的数组相当于
packages: [
        {
            name: "kitty",
            location: "kitty",
            main: "main"
        },
        {
            name: "doggy",
            location: "doggy",
            main: "main"
        }
    ]

name就是名字(废话),是用来被依赖的时候用的名字,location是基于baseurl的地址,但是切记!!!这个地址只是到包为止,不要具体到某个js,main是这个包的主函数。

所以包的地址就是baseUrl + packages.location,包的加载地址就是baseUrl + packages.location + packages.main + ".js"

举一个kitty的例子:

define(['./aaa', './bbb'], function(a, b) {
    return a + " " + b
})

这里的依赖地址要很注意!要用./去寻找当前目录下的其他js,不要习惯于aaa,bbb这样。

还是demo最实在。

原文地址:https://www.cnblogs.com/junhua/p/4305487.html