<script src="js/require.js"></script>

<script src="js/require.js" data-main="js/main"></script>

require(['jquery', 'underscore', 'backbone'], function ($, _, Backbone){

    // some code here

  });

使用require.config()方法,我们可以对模块的加载行为进行自定义。require.config()就写在主模块(main.js)的头部。参数就是一个对象,这个对象的paths属性指定各个模块的加载路径。

  require.config({

    paths: {

      "jquery": "jquery.min",
      "underscore": "underscore.min",
      "backbone": "backbone.min"

    }

  });

 require.config({

    baseUrl: "js/lib",

    paths: {

      "jquery": "jquery.min",
      "underscore": "underscore.min",
      "backbone": "backbone.min"

    }

  });

require.config({

    paths: {

      "jquery": "https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min"

    }

  });

假定现在有一个math.js文件,它定义了一个math模块。那么,math.js就要这样写:

  // math.js

  define(function (){

    var add = function (x,y){

      return x+y;

    };

    return {

      add: add
    };

  });

加载方法如下:

  // main.js

  require(['math'], function (math){

    alert(math.add(1,1));

  });

如果这个模块还依赖其他模块,那么define()函数的第一个参数,必须是一个数组,指明该模块的依赖性。

  define(['myLib'], function(myLib){

    function foo(){

      myLib.doSomething();

    }

    return {

      foo : foo

    };

  });

当require()函数加载上面这个模块的时候,就会先加载myLib.js文件。

require.js的简单使用的更多相关文章

  1. require.js 模块化简单理解

    组件化 基于UI 样式布局 没有过多 js 代码操作的 比如:一个导航栏 一个表单 一个搜索框 一个侧边栏 一个html 等等.... 模块化 基于功能模块 一个可以替换的js部分称之为模块(modu ...

  2. 使用require.js

    requirejs使用入门 什么是requirejs? RequireJS的目标是鼓励代码的模块化,它使用了不同于传统<script>标签的脚本加载步骤.可以用它来加速.优化代码,但其主要 ...

  3. require.js+bootstrap实现简单的页面登录和页面跳转

    小颖的这个demo其实很简单的,大家一起来先来看看页面效果图:          目录: 代码: inde.html <!DOCTYPE html> <html> <he ...

  4. EpiiAdmin 开源的php交互性管理后台框架, 让复杂的交互变得更简单!Phper快速搭建交互性平台的开发框架,基于Thinkphp5.1+Adminlte3.0+Require.js。

    EpiiAdmin EpiiAdmin php开源交互性管理后台框架,基于Thinkphp5.1+Adminlte3.0+Require.js, 让复杂的交互变得更简单!Phper快速搭建交互性平台的 ...

  5. require.js模块化管理和加载js(按需加载)简单实例教学

    一.为什么要用require.js? 最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了.后来,代码越来越多,一个文件不够了,必须分成多个文件,依次加载.下面的网页代 ...

  6. require.js简单入门

    推荐文章:http://www.ruanyifeng.com/blog/2012/11/require_js.html 1.以下例子主要实现功能, 1)引用jq库获取dom中元素文本, 2)实现并引用 ...

  7. [javascript模块化]require.js简单使用

    1.javascript模块规范 CommonJS 主要用于服务器端编程,比如node.js的模块系统,就是参照CommonJS规范实现的.在CommonJS中,有一个全局性方法require(),用 ...

  8. require.js工作原理(初始)

    详情:请见阮一峰老师的日志:http://www.ruanyifeng.com/blog/2012/11/require_js.html: 导入:<script data-main=" ...

  9. require.js基本认识

    基本API require会定义三个变量:define,require,requirejs,其中require === requirejs,一般使用require更简短 define 从名字就可以看出 ...

随机推荐

  1. Mac系统下控制鼠标移动

    CGEventSourceRef source = CGEventSourceCreate(kCGEventSourceStateCombinedSessionState); CGEventRef m ...

  2. poj 题目分类(3)

    OJ上的一些水题(可用来练手和增加自信) (poj3299,poj2159,poj2739,poj1083,poj2262,poj1503,poj3006,poj2255,poj3094) 初期: 一 ...

  3. java装饰者模式理解

    java 装饰者模式其实就是扩展子类的功能,和继承是一个性质. 但继承是在编译时就固定扩展了父类的一些功能,而装饰者模式是在运行过程中动态绑定对象,实现一个子类可以随时扩展功能. 将方法排列组合,也可 ...

  4. 南阳oj27题

    水池数目 时间限制:3000 ms  |  内存限制:65535 KB 难度:4 描述 南阳理工学院校园里有一些小河和一些湖泊,现在,我们把它们通一看成水池,假设有一张我们学校的某处的地图,这个地图上 ...

  5. [php] How to debug PHP in the terminal

    Here I use Netbeans, xdebug to debug the PHP in the terminal of Ubuntu. 1. you have to install the x ...

  6. 10个免费的PHP编辑器/开发工具

    转自: http://www.iteye.com/news/22672 一个好的编辑器或开发工具,能够极大提高我们的开发效率.下面介绍10个免费.强大的PHP编辑器/开发工具.这些编辑器拥有调试器.增 ...

  7. 对linux的根目录执行强制递归移除

    开始开始时使用: #rm -f -r / 提示对根目录使用递归操作很危险,然后就没执行成功,让使用 --no-preserve-root 这个参数. 好吧,反正是虚拟机 于是执行: #rm -f -r ...

  8. android 学习随笔五(界面)

    把数据库内容显示到界面 清单文件设置为线性布局(5大布局属于ViewGroup) 在清单文件中可以增加View显示 LinearLayout ll = (LinearLayout) findViewB ...

  9. sql插入删除表内字段基础操作

    1 取得表格资讯 1.1 DESCRIBE指令 「DESCRIBE」是MySQL资料库提供的指令,它只能在MySQL资料库中使用,这个指令可以取得某个表格的结构资讯,它的语法是这样的: 你在MySQL ...

  10. Tomcat增加缓存