requirejs之demo
具体的理论就不讲了,可以参考
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格式定义的
// require1.js
define(function (){
var add = function (x,y){
return x+y;
};
return {
add: add
};
});
// require2.js
define(function (){
var multiply = function (x,y){
return x*y;
};
return {
multiply: multiply
};
});
// require3.js
define(function(){
var divide=function(a,b){
return a/b; };
return {
divide:divide
}; })
// noAMD.js
function test2(a,b){
return a-b;
}
window.test=test2;
//main.js
require.config({
paths: {
"require1": "src/require1",
"require2": "src/require2",
"test":"src/noAMD"
},
shim:{
"test":{
exports:"test"
} }
});
require(["require1","require2","src/require3",'test'],function(require1,r2,r3,test2){
var a=21,b=3;
alert(require1.add(a,b));
alert(r2.multiply(a,b));
alert(r3.divide(a,b));
alert(test2(a,b))
})
<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
requirejs之demo的更多相关文章
- requirejs之demo (转)
具体的理论就不讲了,可以参考 http://www.ruanyifeng.com/blog/2012/10/javascript_module.html http://www.ruanyifeng.c ...
- 浅谈requireJS
项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习下.通过一步步利用requireJS编写demo,从而学习requireJS的一个整体开发流程以及自我使用requi ...
- 浅谈requireJS 摘自http://www.cnblogs.com/giggle/p/5436710.html
项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习下.通过一步步利用requireJS编写demo,从而学习requireJS的一个整体开发流程以及自我使用requi ...
- requirejs原理深究以及r.js和gulp的打包【转】
转自:http://blog.csdn.net/why_fly/article/details/75088378 requirejs原理 requirejs的用法和原理分析:https://githu ...
- requireJS-初识
浅谈requireJS 2016-04-26 21:44 by 猴子猿, 726 阅读, 0 评论, 收藏, 编辑 项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习 ...
- (五)backbone - DEMO - 通信录改造之使用requirejs
DEMO介绍是 DEMO通信录的扩展,使用requirejs模块化整合 大体实现 • model文件 model/contact.js define(function (){ // user cont ...
- bootstrap + requireJS+ director+ knockout + web API = 一个时髦的单页程序
也许单页程序(Single Page Application)并不是什么时髦的玩意,像Gmail在很早之前就已经在使用这种模式.通常的说法是它通过避免页面刷新大大提高了网站的响应性,像操作桌面应用程序 ...
- 使用RequireJS并实现一个自己的模块加载器 (一)
RequireJS & SeaJS 在 模块化开发 开发以前,都是直接在页面上引入 script 标签来引用脚本的,当项目变得比较复杂,就会带来很多问题. JS项目中的依赖只有通过引入JS的顺 ...
- 使用gulp解决RequireJS项目前端缓存问题(二)
1.前言 这一节,我们主要解决在上一节<使用gulp解决RequireJSs项目前端缓存问题(一)>末尾提到的几个问题: 对通过require-config.js引入的js文件修改后,没有 ...
随机推荐
- java实现第七届蓝桥杯有奖竞猜
有奖竞猜 题目描述 小明很喜欢猜谜语. 最近,他被邀请参加了X星球的猜谜活动. 每位选手开始的时候都被发给777个电子币. 规则是:猜对了,手里的电子币数目翻倍, 猜错了,扣除555个电子币, 扣完为 ...
- java实现第六届蓝桥杯机器人数目
机器人数目 少年宫新近邮购了小机器人配件,共有3类,其中, A类含有:8个轮子,1个传感器 B类含有: 6个轮子,3个传感器 C类含有:4个轮子,4个传感器 他们一共订购了100套机器人,收到了轮子6 ...
- java实现第八届蓝桥杯树型显示
树型显示 题目描述 对于分类结构可以用树形来形象地表示.比如:文件系统就是典型的例子. 树中的结点具有父子关系.我们在显示的时候,把子项向右缩进(用空格,不是tab),并添加必要的连接线,以使其层次关 ...
- Oracle RMAN各类压缩算法对比测试
1.背景概述 2.本次测试环境基本信息 3.测试步骤 3.1. 使用BCO进行压缩备份 3.2. 不使用压缩备份 3.3. 使用ACO中LOW级别进行压缩备份 3.4. 使用ACO中MEDIUM级别进 ...
- k8s学习-文档&概念
1.文档大全 kubernetes objects文档(yaml文件编写): https://kubernetes.io/docs/concepts/overview/working-with-obj ...
- Rust异步之Future
对异步的学习,我们先从Future开始,学习异步的实现原理.等理解了异步是怎么实现的后,再学习Rust异步编程涉及的2个库(futures.tokio)的时候就容易理解多了. Future rust中 ...
- 红楼梦 + 写入 MySQL
import requests import re import pymysql from bs4 import BeautifulSoup conn = pymysql.Connect(host=' ...
- MQ系列(1)——rabbitMQ简介
前文我们学习了 MQ的相关知识,现在我们来学习一下实现了AMQP协议的 rabbitMQ 中间件.rabbitMQ 是使用 erlang 语言编写的中间件(erlang之父 19年4月去世的,很伟大一 ...
- el-checkbox实现全选与单选
实现目的:实现全选与多选,点击确定的时候获取每个值的id传给后台 1.HTML <el-checkbox v-model="checkAll" @change="h ...
- chromedp入门
chromedp入门 chromedp是什么? chromedp是go写的,支持Chrome DevTools Protocol 的一个驱动浏览器的库.并且它不需要依赖其他的外界服务(比如 Selen ...