requireJS的配置心得
1、html页面中如果同时存在data-main和require()和配置(config中的baseUrl)
,那么定义根路径 baseUrl > data-main > index.html 但是data-main和index中的require也都会执行
2、data-main的入口问题:
a. 首先的问题是你在main.js中所设置的脚本是异步加载的。所以如果你在data-main所指的js页面中配置了其它JS加载,则html主页面则不能保证它们所依赖的JS已经加载成功。
3、配置路径paths所导致的问题
当你paths:{
"h":"modules/header",
"f":"modules/footer"
} 的时候,如果这个配置被加载后,如果你在访问配置后的文件(指的是js文件),第一次访问的路径非常关键
为什么说关键?
因为此时的这个js文件已经被路径“锁定”
例如访问 modules/header/header.js文件
a: 如果第一次用h/header.js访问的话,那么此时的header.js文件的路径被h/header.js锁定,再想访问的话就只能通过这条路径访问,
modules/header/header.js访问会报错。
b: 如果第一次用modules/header/header.js访问该js文件的话,那么即使这个文件被配置了,那么h/header.js也将访问不到这个js文件(但是可以通过h访问modules/header文件夹下面的js文件,如module/header/skin.js文件)
4、paths和map联合使用导致的问题
eg:如本文件夹中的main.js
paths: {
'h': 'modules/header',
'f': 'modules/footer'
}
map: {
'h': {
// 引入jquery10版本
'lib/jquery': 'lib/jquery10'
},
'f': {
'lib/jquery': 'lib/jquery200'
}
,
'modules/header/skin': {
'lib/jquery': 'lib/jquery-1.12.2'
}
}
在以上的两条配置中,虽然将modules/header赋值给了h,但是在后面的代码中想要正确的引入jq10版本必须用h/...的形式,用modules/header的方式不可以(因为我们定义的时候是用h定义的)
5、require([],fn)中[]内文件是异步加载的
require(["mvc","bg/bg","header/header","home/home","foot/foot","bottom/bottom","css!../lib/reset.css"],function(MVC){
MVC.install();
})
//注意:这个中括号里面的文件都是异步加载的,我没有在main.js引入jq,在bg加载时如果也没有传入jquery的话,按理来说它的回调函数是不能用$的,但是试验证明回调函数可以用$,这就是引文它后面的header.js加载到了jquery,requirejs特点加载既执行,所以在全局作用域下就有了$了!!
6、配置中shim的问题
拿作品里的MVCrequire版举例
paths:{
jquery:"../lib/jquery-1.12.2",
mvc:"../lib/MVC"
},
shim:{
mvc:{
exports:"MVC",
deps:[]
}
}
主要看exports这个属性,它暴露的是MVC这个对象(这个对象必须在MVC.js这个文件中存在),
这个MVC这个名不是随便起的,它是把MVC.js中的一个变量MVC作为接口暴露出来的,这样之后再次访问该路径下的MVC.js,就会得到MVC对象
再举一个例子:
shim: {
// 处理jquery文件
'lib/jquery-1.12.2': {
// 定义接口
exports: '$',
// 定义依赖集合
deps: []
}
},
在这个例子中,(main是主入口,header是由main require进来的一个文件)
define(['modules/header/skin', 'lib/jquery-1.12.2'],fn)
如果直接像上面这一行这么引入,会是underfined的,因为jquery的路径(lib/jquery-1.12.2)和名字(jquery,这个是JQ内置暴露的名字)不一样
解决这个问题有两个办法:
a:paths: {
jquery: 'lib/jquery-1.12.2'
}
直接配置这个路径,使他的名字和路径一样
b:还是define(['modules/header/skin', 'lib/jquery-1.12.2'],fn)这样直接引入,不过在引入之前要 shim: {
// 处理jquery文件
'lib/jquery-1.12.2': {
// 定义接口
exports: '$',
// 定义依赖集合
deps: []
}
}
这样的话,只要你路径写对了,访问到这个文件了,它就会把$暴露出来!
还有 这里配置的mvc是一个路径
小提示:想看JQ版本号,用$().jquery
requireJS的配置心得的更多相关文章
- Tesseract 3.04 + VS2013 配置心得(包括静态库版本号和Release版本号)
研究Tesseract也有几个星期了 走了一些弯路 网上有非常多VS2010的配置心得 但没有VS2013的, 找到一篇之后, 又发现会有一些小问题, 这里记录下来, 也为新人提供一些帮助. Tess ...
- mysql+tomcat+spring 配置心得(从0开始搭环境)
前几天公司竞一个标要做个POC,前端AugularJs做mobile界面,后端Spring MVC做Restful API供前端调用. 时间紧急,大家都忙,so我这个不写代码的闲人花一上午配了一套Sp ...
- requirejs的配置
baseUrl : 所有模块的查找根路径. 当加载纯.js文件(依赖字串以/开头,或者以.js结尾,或者含有协议),不会使用baseUrl. 如未显式设置baseUrl,则默认值是加载require. ...
- requireJS基本配置相关
requireJS: (1)实现js文件的异步加载,避免页面失去响应: (2)管理模块之间的依赖性,便于代码的编写和维护. 加载: <script src="js/require.js ...
- Requirejs常用配置和应用
requirejs.require方法冲突 如果加载了多个requirejs脚本,每个requirejs会判断是否浏览器已经实现了require和define方法.如果浏览器已经自带require和d ...
- react-route4 按需加载配置心得
本篇文章主要记录笔者项目中使用 react-route + webpack 做路由按需加载的心得,可能只有笔者一个人看,权当日记了. 很久很久以前,react-route还是2.X和3.X版本的时 ...
- VMware+Fedora20+secureCRT7.0配置心得
VMware10 XX版 下载地址 secureCRT7 XX版 下载地址 做好安装等准备工作,打开Fedora虚拟机: 首先.安装openssh-server yum install openssh ...
- CentOS下samba配置心得(smb和nmb都要启动)
印象中以前多次配置成功过,重新配置就把以前的资料找出来: yum安装 samba samba-client samba-swat,然后配置参见:http://www.cnblogs.com/mchin ...
- SSM整个配置心得
个人整合心得,还望指正
随机推荐
- Select与Epoll比较
一.问题引出 联系区别 问题的引出,当需要读两个以上的I/O的时候,如果使用阻塞式的I/O,那么可能长时间的阻塞在一个描述符上面,另外的描述符虽然有数据但是不能读出来,这样实时性不能满足要求,大概的解 ...
- 基于Flex的HTTPService(GET和POST)
一.基于GET的HTTPService: <?xml version="1.0" encoding="utf-8"?><mx:Applicat ...
- 排查问题所用到的一些Linux命令实践(不定期更新。。)
一.前言 线上问题排查可能是每个程序员都会经历的.在排查的过程中,往往会用到很多Linux命令,也会产生一些很实用的技巧.本博文通过分析一次线上问题排查的过程,把所有用到的命令串起来.每个Linux命 ...
- 大大维的贪吃蛇v1
虽然本人一直是个免费的游戏测试员(/手动滑稽),但一直有着一个游戏架构师的梦想.正如马爸爸所说,梦想还是要有的,万一实现了呢? 这些天放寒假,有些空闲时间,就想着做一个简单的游戏机.能达到小时候十几块 ...
- KB奇遇记(4):困难重重的选型
在以往的工作经历中,虽然也会出现公司的一些规章制度,但我鲜少与其打交道,也极少听说.但是来KB这里,突然发现公司居然并没有给我配备电脑!!原因是制度上并没有写IT人员入职需要配备电脑,尔后通过特批流程 ...
- [CSS3] 学习笔记-CSS动画特效
在CSS3中,出现了很多出彩的效果,例如2D.3D以及过度.动画和多列等.这些效果为页面设计添加了很多的可选设计. 1.2D.3D转换 转换,是使元素改变尺寸.形状.位置的一种效果:通过CSS3转换, ...
- Java异常处理机制以及try-catch-finally-return执行顺序
一,简单描述: 当出现程序无法控制的外部环境问题(用户提供的文件不存在,文件内容损坏,网络不可用...)时,JAVA就会用异常对象来描述. 二,JAVA中用2种方法处理异常: 1.在发生异常的地方直接 ...
- GIS制图人员的自我修养(2)--制图意识
GIS制图人员的自我修养(2)--制图意识 by 李远祥 上次提及到GIS制图人员的一些制图误区,主要是为GIS制图人员剖析在制图工作中的一些问题.但如何提高制图的自我修养,却是一个非常漫长的过程,这 ...
- CSS3知识点整理(一)----基本样式
(一) 在编写CSS3样式时,不同的浏览器可能需要不同的前缀.它表示该CSS属性或规则尚未成为W3C标准的一部分,是浏览器的私有属性,虽然目前较新版本的浏览器都是不需要前缀的,但为了更好的向前兼容前缀 ...
- Jenkins学习——Jenkins是什么
Jenkins是什么 对于Jenkins是什么,百度百科给的答案是这样的:Jenkins是一个开源软件项目,旨在提供一个开放易用的软件平台,使软件的持续集成变成可能. 通过这句话,我们可以得到这样的一 ...