具体的理论就不讲了，可以参考

http://www.ruanyifeng.com/blog/2012/10/javascript_module.html

http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_definition.html

http://www.ruanyifeng.com/blog/2012/11/require_js.html

直接上demo

首先创建文件，其中define的是采取amd格式定义的

1
2
3
4
5
6
7
8
9
// add.js
　define(function (){
　　　var add = function (x,y){
　　　　　return x+y;
　　　};
　　　return {
　　　　　add: add
　　　};
　});

　　

 

　　

1
2
3
4
5
6
7
8
9
  // multiply.js
define(function (){
　　var multiply = function (x,y){
　　　　return x*y;
　　};
　　return {
          multiply: multiply
　　};
});

　　

1
2
3
4
5
6
7
8
9
10
11
// divide.js
define(function(){
    var divide=function(a,b){
        return a/b;
         
    };
    return {
        divide:divide
    };
     
})

　　

1
2
3
4
5
// noAMD.js
function testm(a,b){
    return a-b;
}
window.test=test2;

　　

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
//main.js　　
require.config({
　　　　baseUrl:"js",       
　　　　paths: {
　　　　　　"js1": "add",
　　　　　　"js2": "divide",
            "js4":"noAMD"
　　　　},
        shim:{
            "test":{
                exports:"js4"
            }
             
        }
　　});
require(["js1","js2","js/multiply",'js4'],function(j1,j2,j3,j4){
    var a=21,b=3;
    alert(j1.add(a,b));
    alert(j2.multiply(a,b));
    alert(j3.divide(a,b));
    alert(testm(a,b))
})
1
2
3
4
5
6
7
8
9
10
<html>
  <head>
    <meta name="generator"
    content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
    <title></title>
    <script src="require.js" data-main="main"  defer async="true">
    </script>
  </head>
  <body></body>
</html>

　　

此处需要注意非amd格式编写的，需要使用shim

文件：r9.zip

requirejs之demo (转)的更多相关文章

  1. requirejs之demo

    具体的理论就不讲了,可以参考 http://www.ruanyifeng.com/blog/2012/10/javascript_module.html http://www.ruanyifeng.c ...

  2. 浅谈requireJS

    项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习下.通过一步步利用requireJS编写demo,从而学习requireJS的一个整体开发流程以及自我使用requi ...

  3. 浅谈requireJS 摘自http://www.cnblogs.com/giggle/p/5436710.html

    项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习下.通过一步步利用requireJS编写demo,从而学习requireJS的一个整体开发流程以及自我使用requi ...

  4. requirejs原理深究以及r.js和gulp的打包【转】

    转自:http://blog.csdn.net/why_fly/article/details/75088378 requirejs原理 requirejs的用法和原理分析:https://githu ...

  5. requireJS-初识

    浅谈requireJS 2016-04-26 21:44 by 猴子猿, 726 阅读, 0 评论, 收藏, 编辑 项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习 ...

  6. （五）backbone - DEMO - 通信录改造之使用requirejs

    DEMO介绍是 DEMO通信录的扩展,使用requirejs模块化整合 大体实现 • model文件 model/contact.js define(function (){ // user cont ...

  7. bootstrap + requireJS+ director+ knockout + web API = 一个时髦的单页程序

    也许单页程序(Single Page Application)并不是什么时髦的玩意,像Gmail在很早之前就已经在使用这种模式.通常的说法是它通过避免页面刷新大大提高了网站的响应性,像操作桌面应用程序 ...

  8. 使用RequireJS并实现一个自己的模块加载器 (一)

    RequireJS & SeaJS 在 模块化开发 开发以前,都是直接在页面上引入 script 标签来引用脚本的,当项目变得比较复杂,就会带来很多问题. JS项目中的依赖只有通过引入JS的顺 ...

  9. 使用gulp解决RequireJS项目前端缓存问题（二）

    1.前言 这一节,我们主要解决在上一节<使用gulp解决RequireJSs项目前端缓存问题(一)>末尾提到的几个问题: 对通过require-config.js引入的js文件修改后,没有 ...

随机推荐

  1. poj 3228(二分+最大流)

    题目链接:http://poj.org/problem?id=3228 思路:增设一个超级源点和一个超级汇点,源点与每一个gold相连,容量为gold数量,汇点与仓库相连,容量为仓库的容量,然后就是二 ...

  2. Windows 代码实现关机(直接黑屏)

    整理资料的时候发现的以前的代码,本机Win7 x64 Sp1 运行直接关机,黑屏.就是利用RtlAdjustPrivilege函数提权,代码中的注释写的很详细了.用的VS2010写的,直接编译成x64 ...

  3. eq相等 ,ne、neq不相等 EL表达式

    eq相等,ne.neq不相等, gt大于, lt小于 gte.ge大于等于   lte.le 小于等于   not非   mod求模   is [not] div by是否能被某数整除   is [n ...

  4. mfc和win32区别

    Win32通常是指sdk编程方法,app没有被封装,开发人员需要自己搭程序框架:mfC则是以C++类的形式封装了Windows的API,并且包含一个应用程序框架,以减少应用程序开发人员的工作量 (整理 ...

  5. lintcode： 左填充

    题目 实现一个leftpad库,如果不知道什么是leftpad可以看样例 样例 leftpad("foo", 5) >> " foo" leftpa ...

  6. 物联网操作系统Hello China移植mile stone之一：移植基础版本V1.76发布

    Hello China V1.76版发布,这是向ARM系列CPU移植的基础版本.相对V1.75版,该版本主要做了如下的一些调整: 1.  通过宏定义的方式对内核实现了模块化,开发者可以通过开启或关闭预 ...

  7. CreateProcess启动隐藏的外部程序（其实就是CreateDesktop，然后指定STARTUPINFO.lpDesktop）

    HDESK hDesk = CreateDesktop(_T("MyDesk"), NULL, NULL, 0, GENERIC_ALL, NULL); ASSERT(hDesk) ...

  8. VCL里为什么要用类函数代替API，为什么要用CM_消息代替虚函数

    之所以要用类函数代替API,是因为VCL对它做了一些包装,好在API起作用之前和之后做一些额外的事情:通知和判断等等.之所以类函数要包装一个CM_消息,是因为这样方便程序员(在调用类函数的基础上)截断 ...

  9. Struts2笔记——初次框架配置

    1.Struts2简介   Struts 2是Struts的下一代产品,是在 struts 1和WebWork的技术基础上进行了合并的全新的Struts 2框架.其全新的Struts 2的体系结构与S ...

  10. C 中变参函数的处理方式

    C 函数中变化的参数用‘...’ 表示.变化的参数依旧按照C函数传参的规则入栈,即从右往左依次入栈,保证参数从左往右地址依次升高. 解析变参的主要思想是:将变参缓冲区像容纳了不同类型的数组(当然实际的 ...