require.js遵循AMD规范,通过define定义模块,require异步加载模块,一个js文件即一个模块。

一、模块加载require
1.加载符合AMD规范模块

HTML:

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

MAIN.JS

require.config({

    baseUrl: "js/lib",

    paths: {

      "jquery": "jquery.min"

    }

  });

require(['jquery'], function ($){
    // some code here
  });

2.加载不符合AMD规范模块

require.config({
    shim: {
      'underscore':{
       exports: '_'
      },
      'backbone': {
        deps: ['underscore', 'jquery'],
        exports: 'Backbone'
      }
    }
  });

二、模块定义define

define(['math', 'graph'],
function ( math, graph ) {
return {
plot: function(x, y){
return graph.drawPie(math.randomGrid(x,y));
}
}
};
);

三、require+jquery+domready

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="js/require.js"></script>
</head>
<body>
<div id="333">123124</div>
<script>
require.config({
paths: {"jquery": "js/lib/jquery-1.11.1.min",
"domReady": "js/lib/domReady"
}
}); require(["domReady!", "jquery"], function() {
//alert('22')
change();
}); function change(){
$('#333').text('5555');
}
</script> </body>
</html>

原文地址:
http://javascript.ruanyifeng.com/tool/requirejs.html

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

【转】require.js学习笔记(二)的更多相关文章

  1. 【转】require.js学习笔记(一)

    一.立即执行函数 立即执行函数可以有效避免临时变量污染全局空间.可以在页面初始化时,在立即执行函数内实现一次执行变量的定义及使用. for (var i = 0; i < elems.lengt ...

  2. require.js学习笔记(内容属于转载总结)

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

  3. require.js学习笔记

    使用require.js的好处? 1 有效的防止命名冲突(可以将变量封装在模块内,通过暴露出的接口解决命名冲突) 2 解决不同JS文件中的依赖 3 可以让我们的代码以模块化的方式组织 官方网站http ...

  4. [转]node.js学习笔记(二)

    二.express 1.安装 express4 npm --registry=http://registry.npmjs.org install -g express-generator (全局) 2 ...

  5. Node.js学习笔记(二) --- CommonJs和Nodejs 中自定义模块

    一. 什么是 CommonJs? JavaScript 是一个强大面向对象语言,它有很多快速高效的解释器. 然而, JavaScript标准定义的 API 是为了构建基于浏览器的应用程序.并没有制定一 ...

  6. vue.js学习笔记(二):如何加载本地json文件

    在项目开发的过程中,因为无法和后台的数据做交互,所以我们可以自建一个假数据文件(如data.json)到项目文件夹中,这样我们就可以模仿后台的数据进行开发.但是,如何在一个vue.js 项目中引入本地 ...

  7. vue.js学习笔记(二)——vue-router详解

    vue-router详解 原文链接:www.jianshu.com 一.前言 要学习vue-router就要先知道这里的路由是什么?为什么我们不能像原来一样直接用<a></a> ...

  8. angular.js学习笔记(二)

    1.安装core ,shared模块 ng g m core  ng g m shared 2.在shared中导入core模块   core模块只加载一次所以将公共组件放到core中 3.创建公共组 ...

  9. 纯JS实现KeyboardNav(学习笔记)二

    纯JS实现KeyboardNav(学习笔记)二 这篇博客只是自己的学习笔记,供日后复习所用,没有经过精心排版,也没有按逻辑编写 这篇主要是添加css,优化js编写逻辑和代码排版 GitHub项目源码 ...

随机推荐

  1. google打不开啦,咋办?

    前言:以前开发的时候一直使用google浏览器,好像是两年前的某一天突然间发现google搜索不能访问了,我喜欢将自己觉得有趣的网页做成标签页,google不能访问只能先换别的了,firefox也挺不 ...

  2. VMware Workstation(虚拟机)v10.0.1 简体中文破解版

    http://www.xp510.com/xiazai/ossoft/desktools/22610.html

  3. Firefox 23中的新特性(新陷阱)

    话说有一天突然发现我们的网站页面上的JQuery功能都失效了,Firebug中显示如下的错误 Blocked loading mixed active content "http://xxx ...

  4. delphi 10 seattle 安卓服务开发(三)

    delphi 10 里面的安卓服务有四种,上面的一篇文章里面的图有介绍. 今天做一个remote service 的例子.(里面一部分代码是抄别人的,如果不太清楚,自行恶补) remote servi ...

  5. MapReudce中常见join的方案

    两表join在业务开发中是经常用到,了解了大数据join的原理,对于开发有很大的好处. 1.reduce side join reduce side join是一种简单的join的方法,具体思想如下: ...

  6. MySql中的tinying,smallint,int,bigint的类型介绍——转载

    tinyint 从 0 到 255 的整型数据.存储大小为 1 字节. smallint 从 -2^15 (-32,768) 到 2^15 – 1 (32,767) 的整型数据.存储大小为 2 个字节 ...

  7. android框架整理

    http://blog.csdn.net/ma969070578/article/details/27808043 闲来无事.想搭个框架试试 分析一般应用 将资料整理整理 粗略统计 需要以下资料 1. ...

  8. Delphi下使用Oracle Access控件组下TOraSession控件链接

    Delphi下使用Oracle Access控件组下TOraSession控件链接数据库,使用  orsn1.Options.Direct:=true;  orsn1.Server:=IP:Port: ...

  9. 四则运算(Android)版

    实验题目: 将小学四则运算整合成网页版或者是Android版.实现有无余数,减法有无负数.... 设计思路: 由于学到的基础知识不足,只能设计简单的加减乘除,界面设计简单,代码量少,只是达到了入门级的 ...

  10. Spring RMI (Spring 远程方法调用)

    所需jar包...?    不纠结,一股脑儿全导! 源码地址:http://pan.baidu.com/s/1jG8eOmy 先放结构图如下,客户端和服务端都在一个项目中.也可以把服务端的xxx导成j ...