RequireJS官网:www.requirejs.org
为什么使用RequireJS
1、有效的防止变量冲突
2、解决不同的js文件之间的依赖
3、可以写出模块化的代码
RequireJS常用的方法:
1、requirejs.config
2、requirejs
3、define
入口文件(主模板):
data-main=""
<script src="js/require.js" data-main="js/main"></script>
主模板main.js如何编写呢?
//配置require 定义别名
requirejs.config({
//baseUrl: "js/lib", //改变基目录(baseUrl)
paths:{ //指定模块的加载路径
定义模块别名:'引入依赖的js文件的加载路径'
},shim{
//专门用来配置不兼容的模块。具体来说,每个模块要定义
//(1)exports值(输出的变量名),表明这个模块外部调用时的名称;
//(2)deps数组,表明该模块的依赖性。
'jquery.scroll': {
deps: ['jquery'],
exports: 'jQuery.fn.scroll'
}
}
})
//引入模板
requirejs(['引入依赖模块名','valuedata'],function($,valuedata){ //回调函数
console.log(valuedata.show);
})
valuedata.js 如何定义一个模块
1、没有依赖项可以直接写函数,有依赖模块define第一项参数必须为数组
2、依赖模块名:'text!review.txt','image!cat.jpg' text和image插件,则是允许require.js加载文本和图片文件。
define(['引入依赖模块名'],function(//形参){
return {
show:function(){
return 2;
};
}
})