1. 加载require.js文件

<script type="text/javascript" src="js/require.js" data-main="js/main" defer async="true" ></script>

  2. 加载主模块文件

  通过<script>标签设置 data-main="js/main" 加载主模块文件。

  3. 异步加载require.js文件 

  设置 defer async="true" 实现多个浏览器兼容异步加载。

   4. 路径配置

  在main.js的顶部加入下面的代码

require.config({
baseUrl: "js/",
  paths: {
"jquery": "jquery.min",
"underscore": "underscore.min",
"backbone": "backbone.min"
}
});

  5. 加载一个jquery.js文件

define(['jquery'],function ($){
$(function(){
//console.log('jquery已经加载。');
});
});

  6. 加载多个文件 

require(['jquery', 'underscore', 'backbone'], function ($, _, Backbone){
$(function(){
//..
});
});

  7. 加载自定义模块 

//加载key/value格式模块
define(['jquery','jsonobj'],function ($,json){
$(function(){
console.log(json.name +'/'+ json.age);
});
});
//jsonobj.js
define({
'name': 'lbs',
'age': 10
});
//加载一个函数模块
define(['jquery','setColor'],function ($,O){
$(function(){
O.setColor();
});
});
//setColor.js
define(function(){
var color = function (){
    document.getElementsByTagName('body')[0].style.backgroundColor = 'red';
  };
  return {
   setColor: color
};
});
//加载一个依赖关系的函数模块
define(['jquery','color'],function ($,O){
$(function(){
O.setColor();
});
});
//color.js
define(['jquery'],function($){
var color = function(){
    $('body').css('background','red');
  };
  return {
   setColor: color
};
});

  8. 其他配置选项

//加载非AMD标准的模块文件(underscore,backbone某些版本不符合AMD标准)
require.config({
baseUrl: "js/",
paths: {
"jQuery": "jquery.min",
"underscore": "underscore-min",
"backbone": "backbone-min"
},
shim: {
'underscore': {
exports: '_'
},
'backbone': {
deps: ['underscore', 'jQuery'],
exports: 'Backbone'
}
}
});
//shim属性定义不符合AMD标准加载模块文件的输出变量(exports)和依赖文件(deps)
//加载对应模块文件
require(['backbone'], function(Backbone){
var person = Backbone.Model.extend({
defaults: {
name: 'lbs',
age: 10
}
});
var me = new person();
console.log( me.get('name') +'/'+ me.get('age') );
});

认识Require的更多相关文章

  1. WCF : 修复 Security settings for this service require Windows Authentication but it is not enabled for the IIS application that hosts this service 问题

    摘要 : 最近遇到了一个奇怪的 WCF 安全配置问题, WCF Service 上面配置了Windows Authentication. IIS上也启用了 Windows Authentication ...

  2. webpack解惑:require的五种用法

    我之前在 <前端搭环境之从入门到放弃>这篇文章中吐槽过,webpack中可以写commonjs格式的require同步语法,可以写AMD格式的require回调语法,还有一个require ...

  3. express全局安装后无法通过require使用

    今天入门了一下express,首先安装依赖. npm install express -g; npm install body-parser -g; npm install cookie-parser ...

  4. require() 源码解读

    2009年,Node.js 项目诞生,所有模块一律为 CommonJS 格式. 时至今日,Node.js 的模块仓库 npmjs.com ,已经存放了15万个模块,其中绝大部分都是 CommonJS ...

  5. 项目开发(Require + E.js)

    最近在做的几个项目,分别用了不同的框架跟方式,有个H5的项目,用了vue框架, 这个项目我还没有正式加入进去, 等手头的这个项目完成就可以去搞vue了, 现在手头的这个项目是一个招聘的项目, 用到了N ...

  6. Javascript模块化编程(三):require.js的用法

    Javascript模块化编程(三):require.js的用法 原文地址:http://www.ruanyifeng.com/blog/2012/11/require_js.html 作者: 阮一峰 ...

  7. Torch Problems: require some packages doesn't work

    I've recently got a problem. require 'cutorch' doesn't work. But it was ok yesterday, although I hav ...

  8. javascript模块化编程(三):require.js用法

    本文来自阮一峰 这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战. 我采用的是一个非常流行的库require.js. 一.为什么要用require ...

  9. PHP中include()与require()的区别说明

    require 的使用方法如 require("MyRequireFile.php"); .这个函数通常放在 PHP 程序的最前面,PHP 程序在执行前,就会先读入 require ...

  10. CCLuaLoadChunksFromZIP加载后的require路径问题

    对于require来说,在LUA中的机制就是搜索path路径了.但对于CCLuaLoadChunksFromZIP加载的LUA文件来说,require的路径又是怎么样的呢? 我在服务器上有一个 oox ...

随机推荐

  1. facebook打开动画pop

    POP源代码:https://github.com/facebook/pop demo相关链接:https://github.com/jxd001/POPdemo/blob/master/README ...

  2. OpenGL--第一个OpenGL程序

    环境:VS2012 + OpenGL所需文件(其他IDE也可以,不一定要VS2012,VS2010或其他也可以) 步骤: 1.下载Vs2012 2.下载OpenGL所需文件 3.解压缩OpenGL包并 ...

  3. 简单的三方登录SDK示例,Android Activity之间数据的传递

    先建立Library工程,即普通工程然后在Android的属性勾选Library选项. 这里建立的工程为 mySdk ,Activity名为LoginActivity. LoginActivity代码 ...

  4. ExtJS4.2学习(7)——基础知识之Reader&Writer篇

    Reader: 主要用于将proxy数据代理读取的数据按照不同的规则进行解析,将解析好的数据保存到Modle中. 结构图 Ext.data.reader.Reader 读取器的根类(很少直接实例化这个 ...

  5. JMX操作ActiveMQ(1)

    我们知道ActiveMQ broker的管理接口是通过JMX方式提供的. 一个简单的访问方式就是通过jconsole,输入 service:jmx:rmi:///jndi/rmi://localhos ...

  6. Dubbo与Zookeeper、SpringMVC整合和使用(负载均衡、容错)(转)

    互联网的发展,网站应用的规模不断扩大,常规的垂直应用架构已无法应对,分布式服务架构以及流动计算架构势在必行,Dubbo是一个分布式服务框架,在这种情况下诞生的.现在核心业务抽取出来,作为独立的服务,使 ...

  7. HBase经常使用操作之namespace

    1.介绍 在HBase中,namespace命名空间指对一组表的逻辑分组,类似RDBMS中的database,方便对表在业务上划分.Apache HBase从0.98.0, 0.95.2两个版本号開始 ...

  8. jQuery 弹出窗口的形式一直是具体案件的中心

    在网上查 多 不是不符合无效;因此,一些自己总结,解决这个问题   原则: 常见问题: 弹出层居中了,背景也是半透明的  可是发现一拉动滚动栏立即就露馅了发现背景仅仅设置了屏幕所在段,其它部分都是原来 ...

  9. 俄罗斯方块游戏JavaScript代码

    JavaScript代码俄罗斯方块游戏 早就听说网上有人仅仅用60行JavaScript代码写出了一个俄罗斯方块游戏,最近看了看,今天在这篇文章里面我把我做的分析整理一下(主要是以注释的形式). 我用 ...

  10. 基于Redis Sentinel的Redis集群(主从Sharding)高可用方案(转)

    本文主要介绍一种通过Jedis&Sentinel实现Redis集群高可用方案,该方案需要使用Jedis2.2.2及以上版本(强制),Redis2.8及以上版本(可选,Sentinel最早出现在 ...