RequireJS模块化操作
2017-07-12 本文已影响15人
sdcV
一、define 函数定义模块
- 可重用的代码块(模块)有特定的使用目的或行为。我们可以使用RequireJS提供的define()函数来定义模块。三个参数分别为本模块命名的值、本模块的各个依赖项、模块自身代码
define(
moduleName, //可选,如果不写,则默认为本模块所在文件的文件名
dependencies, //可选,一个数组,此数组包含此文件所需的各个依赖项
function (parameters) {
//各个依赖项成功加载后所运行的函数
// parameters中包含的各个值来自于依赖项,与dependencies参数中的各个依赖项形成对应关系
}
);
例如:define(["lib/jquery-1.10.2"], function($){
//这里放的是jquery加载完成后要执行的模块代码
// define函数第一个参数指出jquery库的位置,匿名函数中的参数($)与之对应。
});
模块别名配置:
require.config({
paths: {
"jquery": "lib/jquery-1.10.2"
}
});//现在就可以用"jquery"作为依赖项名称
二、require 加载依赖
- define适合于声明模块便于以后使用,require适用于不需要建立可重用的模块、只需加载各个依赖直接执行的场合。两者的使用方法一样
例如:require(["lib/jquery-1.10.2"], function($){
//这里放的是jquery加载完成后要执行的模块代码
// reuire函数第一个参数指出jquery库的位置,匿名函数中的参数($)与之对应。
});
三、加载非规范的模块
- 理论上,require.js加载的模块,必须是按照AMD规范、用define()函数定义的模块。但是实际上,虽然已经有一部分流行的函数库(比如jQuery)符合AMD规范,更多的库并不符合。那么,require.js是否能够加载非规范的模块呢?
回答是可以的。
这样的模块在用require()加载之前,要先用require.config()方法,定义它们的一些特征。
举例来说,underscore和backbone这两个库,都没有采用AMD规范编写。如果要加载它们的话,必须先定义它们的特征。
require.config({
shim: {
'underscore':{
exports: '_'
},
'backbone': {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
}
}
});
配置不兼容的模块。具体来说,每个模块要定义(1)exports值(输出的变量名),表明这个模块外部调用时的名称;(2)deps数组,表明该模块的依赖性。