认识Require
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的更多相关文章
- 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 ...
- webpack解惑:require的五种用法
我之前在 <前端搭环境之从入门到放弃>这篇文章中吐槽过,webpack中可以写commonjs格式的require同步语法,可以写AMD格式的require回调语法,还有一个require ...
- express全局安装后无法通过require使用
今天入门了一下express,首先安装依赖. npm install express -g; npm install body-parser -g; npm install cookie-parser ...
- require() 源码解读
2009年,Node.js 项目诞生,所有模块一律为 CommonJS 格式. 时至今日,Node.js 的模块仓库 npmjs.com ,已经存放了15万个模块,其中绝大部分都是 CommonJS ...
- 项目开发(Require + E.js)
最近在做的几个项目,分别用了不同的框架跟方式,有个H5的项目,用了vue框架, 这个项目我还没有正式加入进去, 等手头的这个项目完成就可以去搞vue了, 现在手头的这个项目是一个招聘的项目, 用到了N ...
- Javascript模块化编程(三):require.js的用法
Javascript模块化编程(三):require.js的用法 原文地址:http://www.ruanyifeng.com/blog/2012/11/require_js.html 作者: 阮一峰 ...
- 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 ...
- javascript模块化编程(三):require.js用法
本文来自阮一峰 这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战. 我采用的是一个非常流行的库require.js. 一.为什么要用require ...
- PHP中include()与require()的区别说明
require 的使用方法如 require("MyRequireFile.php"); .这个函数通常放在 PHP 程序的最前面,PHP 程序在执行前,就会先读入 require ...
- CCLuaLoadChunksFromZIP加载后的require路径问题
对于require来说,在LUA中的机制就是搜索path路径了.但对于CCLuaLoadChunksFromZIP加载的LUA文件来说,require的路径又是怎么样的呢? 我在服务器上有一个 oox ...
随机推荐
- grep命令参数和使用方法
功能说明:查找符合串的条件的文件. 语言 法国:grep [-abcEFGhHilLnqrsvVwxy][-A<显示列数>][-B<显示列数>][-C<显示列数>] ...
- 怎样处理iOS 5与iOS 6的 low-memory
移动设备终端的内存极为有限,应用程序必须做好low-memory处理工作,才能避免程序因内存使用过大而崩溃. low-memory 处理思路 通常一个应用程序会包含多个view controllers ...
- ZooKeeper安装与运行
ZooKeeper安装与运行 首先从官网下载ZooKeeper压缩包,然后解压下载得到的ZooKeeper压缩包,发现有“bin,conf,lib”等目录.“bin目录”中存放有运行脚本:“conf目 ...
- 全面总结:matlab怎么做漂亮的图
源地址:http://blog.csdn.net/ccxcau/article/details/7362764 MATLAB受到控制界广泛接受的一个重要原因是因为它提供了方便的绘图功能.本章主要介绍2 ...
- 就是这么简单(续)!使用 RestAssuredMockMvc 测试 Spring MVC Controllers(转)
接我前面一篇文章关于RestAssured测试Restful web service的, RestAssured还有一个功能, 使用RestAssuredMockMvc 单元测试你的Spring MV ...
- 用 C++ 标准模板库(STL)的 vector 实现二叉搜索树(BST)
本文由 Justme0翻译自 Code Project 转载请参见文章末尾处的要求. 介绍 众所周知,要建一棵树,我们需要关注它的内存分配与释放.为了避开这个问题,我打算用C++ STL(vector ...
- C语言数组
在C语言中,对于三维或三维以上数组的使用并没有很好的支持,而且使用率也非常的低,后面会对三维数组做一些简单的分析,这篇文章主要以二维数组来探讨一些C语言中数组使用的相关概念和技巧. 1 一个var[i ...
- vim忽略大写和小写查找配置
作者:zhanhailiang 日期:2014-12-17 默认 vim 的查找是区分大写和小写,可通过下面两种方式实现忽略大写和小写查找 set ic? noignorecase 1 指令设定: : ...
- 读书笔记:《重来REWORK》
读书笔记:<重来REWORK> <重来Rework--更为简单有效的商业思维>这本书是看了别人的书单而购买的,初 拿到这本书翻看时,感觉有两点与平常的书不同,一是每个小节非常短 ...
- java使用AES加密解密 AES-128-ECB加密
java使用AES加密解密 AES-128-ECB加密 import javax.crypto.Cipher; import javax.crypto.spec.SecretKeySpec; impo ...