如何在requirejs下引用bootstrap
原本以为只要require过来就能用
require(['jquery','underscore','bootstrap','cache'],function($,U,B,C){
但发现会报错,类似未定义jQuery
原因是在没有requireJS框架之前,如果我们想使用jquery框架,会在HTML页面中通过<script>标签加载,这个时候 jquery框架生成全局变量$和jQuery等全局变量。如果项目中引用了requireJS框架,采用模块化的方式加载jquery,那么 jquery不会再添加全局变量$和 jQuery 。现在问题来了,虽然jquery框架已经开始支持AMD规范,但是jquery的众多插件还是不支持AMD,仍然像以前一样需要使用全局变量$
解决办法很简单 只需要配置requireJS的shim参数,来完成jquery插件的加载。
require.config({
baseUrl:'js',
paths:{
jquery:'static/jquery-1.10.2.min',
underscore:'static/underscore',
bootstrap:'static/bootstrap'
},
shim:{
'bootstrap':['jquery']
},
urlArgs: "bust=" + (new Date()).getTime()
})
完美解决。
当然 jquery ui 也类似
requirejs.config({
shim: {
'jquery.ui.core': ['jquery'],
'jquery.ui.widget': ['jquery'],
'jquery.ui.mouse': ['jquery'],
'jquery.ui.slider':['jquery']
},
paths : {
jquery : 'jquery-2.1.1/jquery',
domReady : 'require-2.1.11/domReady',
'jquery.ui.core' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.core',
'jquery.ui.widget' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.widget',
'jquery.ui.mouse' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.mouse',
'jquery.ui.slider' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.slider'
}
}); require([ 'jquery', 'domReady','jquery.ui.core','jquery.ui.widget','jquery.ui.mouse','jquery.ui.slider'],
function($) { $("#slider" ).slider({
value:0,
min: 0,
max: 4,
step: 1,
slide: function( event, ui ) {}
}); });
如何在requirejs下引用bootstrap的更多相关文章
- 如何在前端项目中引用bootstrap less?
在基于bootstrap css框架的前端项目开发中,如果有grunt build系统,那么工作流是:客制化less,在less中定义自己的 CSS,同时可以随意引用bootstrap中预定义好的cs ...
- Chrome出了个小bug:论如何在Chrome下劫持原生只读对象
Chrome出了个小bug:论如何在Chrome下劫持原生只读对象 概述 众所周知,虽然JavaScript是个很灵活的语言,浏览器里很多原生的方法都可以随意覆盖或者重写,比如alert.但是为了保证 ...
- 如何在Chrome下Debug Mocha的测试
简介 经过前两篇文章的介绍,相信读者对Mocha应该有一定的认知了,本文重点讲述如何在Chrome下Debug Mocha Test, 方便你在测试fail的时候troubleshooting. 关键 ...
- 详细介绍如何在win7下首次实现通过Git bash向Github提交项目
详细介绍如何在win7下首次实现通过Git bash向Github提交项目 引自:http://jingpin.jikexueyuan.com/article/35944.html 作者: wddoe ...
- 如何在IIS7下配置ASP+ACCESS环境
如何在IIS7下配置ASP+ACCESS环境 | 浏览:901 | 更新:2013-01-16 17:46 1 2 3 4 5 6 7 分步阅读 默认装完IIS7之后,使用ASP程序会发现提示数据库连 ...
- 一步一步教你如何在linux下配置apache+tomcat(转)
一步一步教你如何在linux下配置apache+tomcat 一.安装前准备. 1. 所有组件都安装到/usr/local/e789目录下 2. 解压缩命令:tar —vxzf 文件名(. ...
- ActiveX控件的基本操作方法以及如何在VS2010下使用控件
在此,小编就介绍下ActiveX控件的基本操作方法以及如何在VS2010下使用控件,我们以一个程序为例, (1) 打开VS2010编译器(右键以管理员身份运行,因为ActiveX需要注册), ...
- 如何在Linux下拷贝一个目录呢
cp -af newadmin/movie/. uploadfile/mallvideo/ 如何在Linux下拷贝一个目录呢?这好像是再简单不过的问题了. 比如要把/home/usera拷贝到/m ...
- 如何在Ubuntu下使用TF/SD 卡制作Exynos 4412 u-boot启动盘
/** ****************************************************************************** * @author Maox ...
随机推荐
- lua调用java过程
在cocos2dx框架中,有继承好的luaj文件来方便我们去使用lua调用java底层代码,注意:luaj只能使用在安卓平台下,如果在平台下使用,会出错, 所以使用前需要加平台判断,方法 如下: lo ...
- NSRegularExpression
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAu4AAAU2CAIAAABFtaRRAAAAAXNSR0IArs4c6QAAAe9pVFh0WE1MOm
- js中charAt()与charCodeAt()区别
1. str.charAt(index); 返回指定位置的字符 字符串中第一个字符的下标是 0.如果参数 index 不在 0 与 string.length 之间,该方法将返回一个空字符串. ind ...
- Markdown中如何添加特殊符号
符号 说明 编码 符号 说明 编码 符号 说明 编码 " 双引号 " × 乘号 × ← 向左箭头 ← & AND符号 & ÷ 除号 ÷ ↑ 向上箭头 ↑ < ...
- MySQL查询时,查询结果如何按照where in数组排序
MySQL查询时,查询结果如何按照where in数组排序 在查询中,MySQL默认是order by id asc排序的,但有时候需要按照where in 的数组顺序排序,比如where in的id ...
- python 中 * 与**的使用
1.参数中使用如果是函数定义中参数前的*表示的是将调用时的多个参数放入元组中,**则表示将调用函数时的关键字参数放入一个字典中 如定义以下函数 def func(*args): print(args) ...
- python模块之datetime
相比于time模块,datetime模块的接口则更直观.更容易调用 datetime模块定义了下面这几个类: datetime.date:表示日期的类.常用的属性有year, month, day: ...
- build_mem_type_table
该函数设置mem_types结构体数组,结构体定义如下: struct mem_type { unsigned int prot_pte; //二级页表属性 unsigned int prot ...
- HUD:4405-Aeroplane chess(期望飞行棋)
Aeroplane chess Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Pro ...
- Centos7重启网卡失败解决方法
service Network-Manager stop 执行命令解决,如果执行命令还是失败,则是配置文件内容的问题,检查配置文件