RequireJs 依赖管理使用

What?

声明不同js文件之间的依赖,可以按需、并行、延时载入js库,可以让我们的代码以模块化的方式组织。

When?

对于中大型项目,为了团队成员更好得发挥协同力,各自管理各自的JS代码,按需调用各自或公共组件,使代码更加清晰,个人比较推荐使用requireJS,不要问我为什么不适用seaJs,没兴趣。requireJS使用比较简单,那么快上车,老司机准备开车了......

How?

1.在html中引入requirejs

通常使用requirejs的话,我们只需要导入requirejs即可,不需要显式导入其它的js库,因为这个      工作会交给requirejs来做。
       <script src="**/require.js" data-main="*/config"></script>

属性 data-main 是告诉requirejs:你下载完以后,马上去载入真正的入口文件。它一般用来对requirejs进行配置,并且载入真正的程序模块。

2.配置require

      a. 配置requirejs 比如项目中用到哪些模块,文件路径是什么,载入程序主模块

requirejs.config({
baseUrl: '/public/js',
paths: {
app: 'app'
}
});

加载文件

之前的例子中加载模块都是本地js,但是大部分情况下网页需要加载的JS可能来自本地服务器、其他网站或CDN,这样就不能通过这种方式来加载了,我们以加载一个jquery库 为例:

require.config({
baseUrl : '/public/js',
paths : {
//当百度的jquery没有加载成功后,会加载本地js目录下的jquery
jquery : ['http://libs.baidu.com/jquery/2.0.3/jquery', '/public/js/jquery'],
jqueryUI : 'http://cdn.bootcss.com/jqueryui/1.11.4/jquery-ui', app : 'app'
}
});
require(["jquery","jqueryUI","a"],function($,$UI){
$(function(){
alert("load finished");
});
});
上一篇:力扣503. 下一个更大元素 II(单调栈、拉长循环数组,遍历两次)


下一篇:Linux安全加固(二)禁止普通用户su到root/设置SSH终端接入白名单/修改history条数