requirejs测试
参考资料:http://www.ruanyifeng.com/blog/2012/11/require_js.html
一、文件目录

二、html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>require-js-test</title>
<meta name="viewport" content="width=device-width,initial-scale=1, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui"/>
<script data-main="js/main.js" src="js/require.js"></script>
</head>
<body>
</body>
</html>
三、mainjs
require.config({
paths: {
"jquery": "helper/jquery",
}
});
require(["jquery"],function ($) {
alert("jquery已经加载完毕");
})
或者另外一种写法
require.config({
baseUrl:"js/helper",
paths: {
"jquery": "jquery",
}
});
require(["jquery"],function ($) {
alert("jquery已经加载完毕");
})
四、在main中调用jquery,必须让jquery中先定义再返回,经过查找源码知:
define( "jquery", [], function() {
return jQuery;
} );
五、扩展,假设我在helper增加一个自己写的加法math.js,
W11.png)

define(function(){
function sum(a,b) {
return a+b;
};
return{
add:sum,
};
})
下面来看main.js
require.config({
paths: {
"jquery": "helper/jquery",
"math":"helper/math"
}
});
require(["jquery","math"],function ($,math) {
$(".box").css("color","red");
alert(math.add(1,2));
})
六、加载非规范的模块(针对没有用AMD规范写的js,想要在main.js中引用)
理论上,require.js加载的模块,必须是按照AMD规范、用define()函数定义的模块。但是实际上,虽然已经有一部分流行的函数库(比如jQuery)符合AMD规范,更多的库并不符合。那么,require.js是否能够加载非规范的模块呢?
回答是可以的。
这样的模块在用require()加载之前,要先用require.config()方法,定义它们的一些特征。
举例来说,underscore和backbone这两个库,都没有采用AMD规范编写。如果要加载它们的话,必须先定义它们的特征。
require.config({
shim: {
'underscore':{
exports: '_'
},'backbone': {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
}}
});
require.config()接受一个配置对象,这个对象除了有前面说过的paths属性之外,还有一个shim属性,专门用来配置不兼容的模块。具体来说,每个模块要定义(1)exports值(输出的变量名),表明这个模块外部调用时的名称;(2)deps数组,表明该模块的依赖性。
比如,jQuery的插件可以这样定义:
shim: {
'jquery.scroll': {
deps: ['jquery'],
exports: 'jQuery.fn.scroll'
}
}
requirejs测试的更多相关文章
- 利用Angularjs测试引擎Karma进行自动化单元测试
Karma是Google用于angularjs框架单元测试的js引擎(javascript test runner ), angular1 和angular2项目源码的单元测试都是基于karma和ja ...
- SeaJS与RequireJS最大的区别
SeaJS与RequireJS最大的区别 U_U 2013-06-20 16:21:12 执行模块的机制大不一样-----------------------------------由于 Requir ...
- ES6新特性:使用export和import实现模块化
在ES6前, 前端就使用RequireJS或者seaJS实现模块化, requireJS是基于AMD规范的模块化库, 而像seaJS是基于CMD规范的模块化库, 两者都是为了为了推广前端模块化的工 ...
- Sea.js
SeaJS与RequireJS最大的区别 执行模块的机制大不一样-----------------------------------由于 RequireJS 是执行的 AMD 规范, 因此所有的 ...
- export和import实现模块化
export和import实现模块化 阅读目录 ES6的模块化的基本规则或特点: 下面列出几种import和export的基本语法: ES6导入的模块都是属于引用: 循环依赖的问题: 浏览器兼容: 参 ...
- ES6新特性:使用export和import实现模块化(转载)
在ES6前, 前端就使用RequireJS或者seaJS实现模块化, requireJS是基于AMD规范的模块化库, 而像seaJS是基于CMD规范的模块化库, 两者都是为了为了推广前端模块化的工 ...
- angularJS+requireJS并集成karma测试实践
最近在为下一个项目做前端技术选型,Angular是必须要用的(BOSS指定,个人感觉也不错,开发效率会很高).由于需要加载的JS很多,所以打算看看angular和requirejs一起用会怎么样.在g ...
- karma+requirejs+angular 测试
http://karma-runner.github.io/0.8/plus/RequireJS.html karma 不是测试框架,只是一个运行测试框架的服务器 karma测试的原理是,将所有的文件 ...
- requirejs 打包 添加版本号收集资料 待测试
https://www.npmjs.org/package/rjs-optimhttps://www.npmjs.org/package/grunt-requirejs-md5指定js版本号 但不是M ...
随机推荐
- CentOS配置sshd
用SSH来远程管理计算机,就不用到计算机实际地点来回跑了 环境:服务器:CentOS6.6,客户机win8.1 putty 配置服务器: 1.检查SSHD是否安装(默认情况下是系统自带的),使用命令 ...
- OS | Socket
TCP 创建socket: int socket(int domain, int type, int protocol); AF = Address FamilyPF = Protocol Famil ...
- gitlab详解
a.安装并创建用户 yum -y install curl policycoreutils policycoreutils-python openssh-server openssh-clients ...
- cef 下载地址
最新的CEF3源代码在:http://cefbuilds.com/CEF3的论坛:http://www.magpcss.org/ceforum/viewforum.php?f=5CEF3 C++开发环 ...
- U盘格式化时分配单元的大小的设置
格式化时主要有如下格式,且对应的操作系统的不一样: FAT32:Windows和Mac都支持,不过单个文件不能超过4G,但可以采用分包压缩的方式搞定. NTFS:Windows专用格式,Mac常规无法 ...
- iOS- Exception Type: 00000020:什么是看门狗机制(转)
1.前言 前几天我们项目闪退之后遇到的一个Crash,之后逛了许多论坛,博客都没有找到满意的回复 在自己做了深入的研究之后,对iOS的看门狗机制有了一个基本的了解 而有很多奇怪的Crash可 ...
- C#中如何让ListView控件点击选中整行
将Listview控件的FullRowSelect属性置为True,当然Listview的View属性应该是Details. 2017年6月25日17:15:55
- JSP自己定义标签继承哪个类
JSP自己定义标签继承哪个类 解:JSP自己定义标签继承TagSupport
- 百度地图之标注一组地理坐标<2>
一.需求 开发移动地图相关的应用有时会有这种需求:在地图上显示自己的定位,然后想查看周边使用这个应用的有哪些人.当然完毕这个功能须要后台数据的支持.你要把自己的位置信息发给后台,后台在依据你的位置查询 ...
- vue2.0 + vux (四)Home页
1.综合页(首页) Home.vue <!-- 首页 --> <template> <div> <!-- 顶部 标题栏 --> <app-head ...