requireJs require.config公共配置

时间:2022-03-26 07:12:21
//场景:让require.config配置文件成一个公共文件,每个页面引用这个公共配置
//方式一样例:
require.config({
baseUrl: (function () {
var pathName = document.location.pathname;
var index = pathName.substr(1).indexOf("assets/");
var result = pathName.substr(0, index + 1);
return result;
})()+'assets/js/', //基础目录,最好使用绝对路径,不然被路径搞得晕头转向,/开头, (../上一级目录 ./当前目录 /根目录)
paths:{
"jquery":"plugins/jquery/jquery-1.8.0.min",
"text":"plugins/require-text/text",
'Handlebars':'plugins/handlebars/handlebars',
'underscore':'plugins/underscore/underscore-min'
},
shim:{
'pocFilter':{
deps:['jquery'],
exports: 'pocFilter'
}
}
}); //引用require.js
<script src="scripts/require.js" data-main='scripts/business/example'></script> //example.js使用公共配置
require(['scripts/config'], function() {
// Configuration loaded now, safe to do other require calls
// that depend on that config.
require(['jquery'], function($) { });
}); //方式二: 1、html页面:
<script src="require.js" defer async="true" data-main="page1"></script> 2、page1.js:
require(['config'],function(){
require(['app/controller1'])
}) 3、controller1.js:
define(function(require,exports,module){
var $=require('jquery');
console.info($)
}) //参考资料-https://github.com/requirejs/example-multipage.git //模块定义方式 //1.简单的键值对形式 Simple Name/Value Pairs
define({
"name":"leyi",
"sex":"male"
}); //2.定义函数型模块 Definition Functions
define(function(){
function setName(name){
console.info(name)
}
function setSex(sex){
console.info(sex)
} return {
"setName":setName,
"setSex":setSex
}
}); //2.定义函数型模块(有依赖模块) Definition Functions with Dependencies define(['jquery'],function($){
return {
"lookDependencies":function(){
console.info($)
}
}
}); //3.模块不必返回对象。允许从函数中返回任何有效值 define(['jquery'],function($){
return function(){
return 'hello world!'
}
}); //4.用commonJS方式定义模块
define(function(require,exports, module){
var $=require('jquery');
return function(){
console.info($)
}
}) //5.定义一个有名称的模块(不推荐显式指定模块名称)
define("leyi",function(require,exports, module){
var $=require('jquery');
return function(){
console.info($)
}
}); //注意事项: /*一个文件一个模块: 每个Javascript文件应该只定义一个模块,
这是模块名-至-文件名查找机制的自然要求。
多个模块会被优化工具组织优化,但你在使用优化工具时应将多个模块放置到一个文件中。*/ /*
define()中的相对模块名: 为了可以在define()内部使用诸如require("./relative/name")的调用以正确解析相对名称,
记得将"require"本身作为一个依赖注入到模块中:
define(["require", "./relative/name"], function(require) {
var mod = require("./relative/name");
});
或者更好地,使用下述为转换CommonJS模块所设的更短的语法:
define(function(require) {
var mod = require("./relative/name");
});*/