RequireJS 是一個(gè)JavaScript模塊加載器服赎，非常適用在瀏覽器中使用重虑。
引入庫(kù)
其中script標(biāo)簽的data-main屬性表示入口文件的引入路徑
<script data-main="js/main.js" src="./js/require.js"></script>
require.js三板斧：require define require.config
- require: 調(diào)用模塊
- define: 定義模塊
- require.config: 配置模塊
require:
// 第一個(gè)參數(shù)依賴的模塊缺厉，第二個(gè)為回調(diào)函數(shù)
// 注意：a.js表示相對(duì)于html文件的路徑提针，寫a是相對(duì)于script標(biāo)簽的data-main定義文件的相對(duì)路徑
// 回調(diào)函數(shù)參數(shù)表示a曹傀，b模塊返回的對(duì)象
// requirejs AMD規(guī)范，提前把要依賴的模塊家載好嗜价，再執(zhí)行后面的回調(diào)
// seajs CMD規(guī)范久锥，不需要提前執(zhí)行家淤，順序執(zhí)行加載（即使用到的時(shí)候執(zhí)行加載）
require(['a', 'b'], function(a, b) {
console.log(a.sum(2, 5));
console.log(b.mult(2, 5));
});
define:
// a.js
define(function() {
function sum(a, b) {
return a+b;
}
return { // return 表示暴露給外面的對(duì)象
sum : sum
};
});
// b.js
define(function() {
function mult(a, b) {
return a * b;
}
return {
mult : mult
};
});
require.config:
require.config({
baseUrl : 'js', // 根目錄
paths: {
tools: ['libs/tools'] // 定義模塊名與模塊文件的映射關(guān)系媒鼓，也可以設(shè)置數(shù)組绿鸣，前面如果找不到就找后面的潮模，一般用戶cdn的備選方案
}
})
require(['a', 'b', 'tools'], function(a, b, tools) {
console.log(a.sum(2, 5));
console.log(b.mult(2, 5));
console.log(tools.sayHello('Jack'));
});
// libs/tools.js
define(function() {
function hello(name) {
return 'hello ' + name + ' !';
}
return {
sayHello: hello
};
})
