require.js学习笔记(内容属于转载总结)
<script data-main="src/app" src="src/lib/require.js"></script>
backbone插件中,需要通过script标签引入require.js。
data-main属性的作用是,指定网页程序的主模块,即网页的主模块是src下的app.js
require.js
1、网页主模块是app.js,主模块依赖于其他的模块,这样就会用到require()和require.config()
当需要依赖的模块和主模块在同一目录下时,使用require()或require.config()
当需要依赖的模块和主模块不在同一目录下时,使用require.config()
2、require(['jquery', 'underscore', 'backbone'], function ($, _, Backbone){
// some code here
});
require()中有两个参数,第一个参数是数组,内容主模块要依赖的模块,例子中表示主模块
依赖于jquery.js、underscore.js、backbone.js
第二个参数是个回调函数,当前面指定的模块都加载成功后,它将被调用。加载的模块会以参
数形式传入该函数,从而在回调函数内部就可以使用这些模块。
3、当主模块app.js和三个需要依赖的模块jquery.js、underscore.js、backbone.js不在同一个目录
下的时候,可以使用require.config()
require.config()中参数paths是个对象,paths属性指定各个模块的加载路径。baseUrl表示的是改变基目录,如下(2)所示
(1) require.config({
paths: {
"jquery": "lib/jquery.min",
"underscore": "lib/underscore.min",
"backbone": "lib/backbone.min"
}
});
(2) require.config({
baseUrl: "js/lib",
paths: {
"jquery": "jquery.min",
"underscore": "underscore.min",
"backbone": "backbone.min"
}
});
(3)如果某个模块在另一台主机上,也可以直接指定它的网址,比如:
require.config({
paths: {
"jquery": "https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min"
}
});
4、按照AMD规范,模块必须采用特定的define()函数来定义。如果一个模块不依赖其他模块,那么可以直接定义在define()函数之中。
例: 假定现在有一个math.js文件,它定义了一个math模块。那么math.js就要这样写:
// math.js
define(function (){
var add = function (x,y){
return x+y;
};
return {
add: add
};
});
加载方法如下:
// main.js
require(['math'], function (math){
alert(math.add(1,1));
});
如果这个模块还依赖其他模块,那么define()函数的第一个参数,必须是一个数组,指明该模块的依赖性。
define(['myLib'], function(myLib){
function foo(){
myLib.doSomething();
}
return {
foo : foo
};
});
当require()函数加载上面这个模块的时候,就会先加载myLib.js文件。
5、加载非规范的模块
这样的模块在用require()加载之前,要先用require.config()方法,定义它们的一些特征。
例:underscore和backbone这两个库,都没有采用AMD规范编写。如果要加载它们的话,必须先定义它们的特征。
require.config({
shim: {
//shim是用来配置不兼容的模块。具体来说,每个模块要定义exports值(输出的变量名),表明这个模块外部调用时的名称
'underscore':{
exports: '_'
},
'backbone': {
deps: ['underscore', 'jquery'],
//deps数组,表明该模块的依赖性。即backbone.js依赖于underscore.js和jquery.js
exports: 'Backbone'
}
}
});
参考网址:http://www.cnblogs.com/duanhuajian/archive/2013/01/04/2844151.html
require.js学习笔记(内容属于转载总结)的更多相关文章
- 【转】require.js学习笔记(二)
require.js遵循AMD规范,通过define定义模块,require异步加载模块,一个js文件即一个模块. 一.模块加载require1.加载符合AMD规范模块 HTML: <scrip ...
- require.js学习笔记
使用require.js的好处? 1 有效的防止命名冲突(可以将变量封装在模块内,通过暴露出的接口解决命名冲突) 2 解决不同JS文件中的依赖 3 可以让我们的代码以模块化的方式组织 官方网站http ...
- 【转】require.js学习笔记(一)
一.立即执行函数 立即执行函数可以有效避免临时变量污染全局空间.可以在页面初始化时,在立即执行函数内实现一次执行变量的定义及使用. for (var i = 0; i < elems.lengt ...
- Vue.js学习笔记(2)vue-router
vue中vue-router的使用:
- vue.js 学习笔记3——TypeScript
目录 vue.js 学习笔记3--TypeScript 工具 基础类型 数组 元组 枚举 字面量 接口 类类型 类类型要素 函数 函数参数 this对象和类型 重载 迭代器 Symbol.iterat ...
- 基于jquery的插件turn.js学习笔记
基于jquery的插件turn.js学习笔记 简介 turn.js是一个可以实现3d书籍展示效果的jq插件,使用html5和css3来执行效果.可以很好的适应于ios和安卓等触摸设备. How it ...
- Node.js学习笔记(2):基本模块
Node.js学习笔记(2):基本模块 模块 引入模块 为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件里,这样,每个文件包含的代码就相对较少,很多编程语言都采用这种组织代码的方式.在No ...
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- 2019-4-29 js学习笔记
js学习笔记一:js数据类型 1:基本数据类型 number类型(整数,小数) String类型 boolean类型 NaN类型其实是一个nu ...
随机推荐
- WCF 自托管、无配置文件实现jsonp(跨域)的访问
以下内容基于WCF4.0,本文将对比讨论配置文件方案和无配置文件方案的实现方式. WCF4.0加入了对RESTFU和标准终结点的支持,这为实现跨域提供了简单的方式. 一.有配置文件的情况: 首先我们先 ...
- Duilib中系统消息在自己窗口类的使用
这些Win32消息响应函数,子类只需要重写,不需要在HandleMessage里面再调用一次 开发中遇到的问题,在任务栏关闭程序,会响应WM_SYSCOMMAND消息,因为要给用户提示是否关闭,所以需 ...
- Struts2的处理结果(二)——处理结果的类型
Struts2的处理结果(二) --处理结果的类型 1.Struts2內建的支持的结果类型: 在<result>元素中的type属性,确定了结果类型. chain:Action链式处理的结 ...
- Struts2的配置
Struts2的配置 Struts2可以通过Convention插件管理Action和结果映射,也可以通过使用XML文件进行管理,这两种方式各有好处:使用Convention插件管理减少了XML文件的 ...
- 启动Print Spooler服务提示:"错误1068,依存服务或无法启动"
本人windows8操作系统,从网上看到在运行中输入 sc config spooler depend= rpcss 即可,试了下果然有效.具体原因待了解.
- Block很简单,就像delegate的简化版
代理设计模式对于iOS开发的人来说肯定很熟悉了,代理delegate就是委托另一个对象来帮忙完成一件事情,为什么要委托别人来做呢,这其实是MVC设计模式中的模块分工问题,例如View对象它只负责显示界 ...
- [Python]解决python链式extend的技巧
众所周知python中的list是可以extend的,功能 旨在将两个list合并成一个.譬如[1,2,3].extend([4,5,6])=[1,2,3,4,5,6] 假如有一个list的list, ...
- Java反序列化漏洞通用利用分析
原文:http://blog.chaitin.com/2015-11-11_java_unserialize_rce/ 博主也是JAVA的,也研究安全,所以认为这个漏洞非常严重.长亭科技分析的非常细致 ...
- SQL行转列
目的:将相同条件的多行值合并到同一列, 1.创建测试表: CREATE TABLE [dbo].[TB_01]( ) NULL, ) NULL, [SDATE] [datetime] NULL ) O ...
- mysql获得自增字段下一个值
初次研究: 表: sql: show table status from carsale_db LIKE 'tb_car' 结果: 想办法取得这其中的值.... 在Internet上找到这个资料: M ...