RequireJS示例
建议项目结构：
HTML文件结构：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body> Test <a id="aTest" href="#">Link1</a>
<a id="bTest" href="#" onclick="MyApi.foo()">Link2</a> <script data-main="js/app.js" src="js/require-min.js"></script> </body>
</html>
调用方式采用两种方式：
1、JS绑定aTest的onClick事件；（建议）
2、HTML代码中调用JS事件；
app.js
requirejs.config({
baseUrl:'js',
paths:{
}
});
var MyApi = {};
requirejs(['lib/jquery-1.11.2.min', 'app/fsub'],
function($, fsub){
fsub();
MyApi.foo = function(){
alert('Test');
};
}
);
app.js调用fsub
fsub.js：作用：初始化aTest的点击事件
define(['app/sub'],function(sub){
return function() {
$('#aTest').on('click',function(){
alert(sub.color+'ff');
});
}
});
sub.js：定义常量
define({
color:'black',
size:'unisize'
});
参考：http://requirejs.cn/
RequireJS示例的更多相关文章
- 转:requirejs打包压缩r.js使用示例
为了应对日益复杂,大规模的JavaScript开发.我们化整为零,化繁为简.将复杂的逻辑划分一个个小单元,各个击破.这时一个项目可能会有几十个甚至上百个JS文件,每个文件为一个模块单元.如果上线时都是 ...
- RequireJS与SeaJS模块化加载示例
web应用越变的庞大,模块化越显得重要,尤其Nodejs的流行,Javascript不限用于浏览器,还用于后台或其他场景时,没有Class,没有 Package的Javascript语言变得难以管理, ...
- 转: requirejs压缩打包r.js使用示例 2 (~~很详细的教程)
这一篇来认识下打包工具的paths参数,在入门一中 就介绍了require.config方法的paths参数.用来配置jquery模块的文件名(jQuery作为AMD模块时id为“jquery”, 但 ...
- 使用requirejs来管理angularJS依赖示例
有关requirejs是什么在这里不做解释,只用纯代码实战让你感受requirejs依赖管理的强大. 一.首先要先下载require.js,然后整一个入口文件main.js包括了对其他js的引用. / ...
- requirejs配置代码示例
requirejs大致用法:通过定义模板define()再通过require()或requirejs()加载模板,paths是路径,如果路径长可以把它赋一个短名称加入ruquire()中,shim是兼 ...
- RequireJS 模块的定义与加载
模块不同于传统的脚本文件,它良好地定义了一个作用域来避免全局名称空间污染.它可以显式地列出其依赖关系,并以函数(定义此模块的那个函数)参数的形式将这些依赖进行注入,而无需引用全局变量.RequireJ ...
- 浅谈HTML5单页面架构（三）—— 回归本真：自定义路由 + requirejs + zepto + underscore
本文转载自:http://www.cnblogs.com/kenkofox/p/4650310.html 不过,这一篇,我想进一步探讨一下这两个框架的优缺点,另外,再进一步,抛开这两个框架,回到本真, ...
- requirejs使用
实现模块化.按需加载. 一.配置参数. 1.baseUrl:以一个相对于baseUrl的地址来加载所有的代码. data-main,使用它来启动脚本加载过程,而baseUrl一般设置到与该属性相一 ...
- 新建一个angularjs+requirejs+bootstrap+typescript+gulp+vscode+git的项目
环境 windows 10 准备工具 Visual Studio Code Node.js Git 需求 必须支持IE8 步骤开始: 执行命令行工具 mkdir Demo && cd ...
随机推荐
- 图片_ _Android有效解决加载大图片时内存溢出的问题 2
Android有效解决加载大图片时内存溢出的问题 博客分类: Android Android游戏虚拟机算法JNI 尽量不要使用setImageBitmap或 setImageResource或 Bit ...
- Python从2.6升级到2.7，使用pip安装module，报错：No Module named pip.log（转载）
From:http://blog.csdn.net/iefreer/article/details/8086834 python升级后,使用pip安装module,错误: 错误原因:版本升级后,之前的 ...
- ISO14229系列之一：简介
作者:autogeek 原文链接:http://www.cnblogs.com/autogeek/p/4458591.html 前言 由于工作中经常用到ISO-14229,因此决定对该协议做个总体介绍 ...
- 如何用js来判断浏览器类型(ie,firefox)等等
现在网络上的浏览器,操作系统就象中国的方言一样,那个叫多啊!这给我们这些开发人员 带来了巨大的痛苦!虽然可能大家的喜好不同!用的系统也不同!有人喜欢用ie,有人喜欢用 firefox,还有人喜欢用腾讯 ...
- Win8驱动测试模式
打开驱动测试模式(保存成bat文件,双击执行) bcdedit /set testsigning on pause 执行完成后,看见提示操作成功的提示,之后我们重启一下,再次进入系统,在桌面的右下角会 ...
- android 4.4 状态栏隐藏
这个是Android Developer上的原文 反正我也看得不是很懂 我知道的就是实现和导航栏和状态栏的透明 带一些渐变效果 1. 设置主题 <style name="Theme.T ...
- centos设置开机自启动
编辑 /etc/rc.d/rc.local 将要开启的服务添加到该文件即可
- SDP平台操作视频
一.SDP平台交流咨询联系方式 平台设计端:基于Winform C/S的可视化软件是设计器(生成B/S架构的应用软件 html文件) 平台应用端:基于.Net 的 B/S架构的html文件的应用软件 ...
- java整数类型
1.整数类型:byte占8位,short 占16位,int占32位,long占64位. 2.对于long类型的值,若赋值给的值大于int类型的最大值或小于int型的最小值,则需要在数字后加L或l,表示 ...
- OC基础(10)
id类型 SEL类型 *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !im ...