GitHub: https://github.com/AxeMea/Sleuth.js
Sleuth是一个加载框架,它允许开发者只需要require相应的库或者插件,不需要去下载,就可以直接使用,并且允许开发者任意切换版本。
<script type="text/javascript" src="https://rawgithub.com/axemea/sleuth/master/mappings/mapping-ch.min.js"></script>
<script type="text/javascript" src="sleuth.js"></script>
先后引用mapping-ch.min.js,sleuth.min.js文件,注意顺序。mapping-ch.min.js是库的版本映射文件,定义了引用各个库和插件的源地址。默认的引用的是一个公共的映射文件,当然开发者也可以定义自己的映射文件。
Sleuth.js只向外提供了一个require方法
//加载一个库
Sleuth.require(['jquery'],function(){
//write your code
});
//加载多个库
Sleuth.require(['jquery','prototype','response'],function(){
//write your code
});
//选择版本加载
Sleuth.require(['jquery|1.8.3','prototype','response'],function(){
//write your code
});
初始的映射文件为:
var refMapping = {
prototype:{
'1.7.2':'http://cdn.bootcss.com/prototype/1.7.2/prototype.min.js'
},
jquery:{
'1.8.3':'http://code.jquery.com/jquery-1.8.3.min.js',
'1.8.2':'http://code.jquery.com/jquery-1.8.2.min.js'
},
ext:{
'4.2.1':{
u:'http://cdn.bootcss.com/extjs/4.2.1/ext-all.min.js',
c:'http://cdn.bootcss.com/extjs/4.2.1/resources/ext-theme-classic/ext-theme-classic-all.css'
}
},
backbone:{
'1.1.2':'http://cdn.bootcss.com/backbone.js/1.1.2/backbone-min.js'
},
response:{
'0.9.1+201410311050':'http://cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js'
}
};
};
开发者如果需要其它的库或者插件可以Pull Request过来,我们将丰富到映射文件中去,当然开发者也可以编写自己的本地映射配置文件。但我们真诚的希望,您能将您的需求提交给我们,你需要的,必然他人也需要,谢谢。
var refMapping = {
//单版本配置
prototype:{
'1.7.2':'http://cdn.bootcss.com/prototype/1.7.2/prototype.min.js'
},
//多版本配置
jquery:{
'1.8.3':'http://code.jquery.com/jquery-1.8.3.min.js',
'1.8.2':'http://code.jquery.com/jquery-1.8.2.min.js'
},
//带一个css的库的配置
ext:{
'4.2.1':{
//url
u:'http://cdn.bootcss.com/extjs/4.2.1/ext-all.min.js',
//css
c:'http://cdn.bootcss.com/extjs/4.2.1/resources/ext-theme-classic/ext-theme-classic-all.css'
}
},
//带多个css的库的配置
demo:{
'1.0':{
u:'demo.js',
c:['demo1.css','demo2.css']
}
}
};
需要值得注意的是,在配置版本顺序的时候,推荐最新版本的写在前面,这样默认的话,选择的就是最新版本。
可以是各个cdn点的资源如:
var refMapping = {
ext:{
'4.2.1':{
//url
u:'http://cdn.bootcss.com/extjs/4.2.1/ext-all.min.js',
//css
c:'http://cdn.bootcss.com/extjs/4.2.1/resources/ext-theme-classic/ext-theme-classic-all.css'
}
}
};
如果想引用github中开源库的代码,需要注意的是其引用地址,比如Sleuth.js, https://github.com/AxeMea/Sleuth.js/blob/master/sleuth.js 这个地址是不行的,需要的是直接访问文件系统的地址, https://rawgit.com/axemea/sleuth/master/sleuth.js
require(['sleuth'], function (Sleuth) {
Sleuth.require(['jquery|1.8.3','prototype','response'],function(){
//write your code
});
});
如果必须需要和require.js一起用时,我们推荐下面的用法,更能体现Sleuth.js和require.js的功能倾向
Sleuth.requery|1.8.3','prototype','response','require'],function(){
require(['App_module_1','App_module_2','App_module_3'], function (module1,module2,module3) {
//write your code
});
});
CommonJS规范
库名 版本号 脚本引用地址 样式引用地址
prototype 1.7.2 http://cdn.bootcss.com/prototype/1.7.2/prototype.min.js
jquery 1.8.3 http://code.jquery.com/jquery-1.8.3.min.js
1.8.2 http://code.jquery.com/jquery-1.8.2.min.js
ext 4.2.1 http://cdn.bootcss.com/extjs/4.2.1/ext-all.js http://cdn.bootcss.com/extjs/4.2.1/resources/ext-theme-classic/ext-theme-classic-all.css
backbone 1.1.2 http://cdn.bootcss.com/backbone.js/1.1.2/backbone-min.js
response 0.9.1+201410311050 http://cdnjs.cloudflare.com/ajax/libs