具体的理论就不讲了，可以参考

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的更多相关文章

  1. requirejs之demo (转)

    具体的理论就不讲了,可以参考 http://www.ruanyifeng.com/blog/2012/10/javascript_module.html http://www.ruanyifeng.c ...

  2. 浅谈requireJS

    项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习下.通过一步步利用requireJS编写demo,从而学习requireJS的一个整体开发流程以及自我使用requi ...

  3. 浅谈requireJS 摘自http://www.cnblogs.com/giggle/p/5436710.html

    项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习下.通过一步步利用requireJS编写demo,从而学习requireJS的一个整体开发流程以及自我使用requi ...

  4. requirejs原理深究以及r.js和gulp的打包【转】

    转自:http://blog.csdn.net/why_fly/article/details/75088378 requirejs原理 requirejs的用法和原理分析:https://githu ...

  5. requireJS-初识

    浅谈requireJS 2016-04-26 21:44 by 猴子猿, 726 阅读, 0 评论, 收藏, 编辑 项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习 ...

  6. （五）backbone - DEMO - 通信录改造之使用requirejs

    DEMO介绍是 DEMO通信录的扩展,使用requirejs模块化整合 大体实现 • model文件 model/contact.js define(function (){ // user cont ...

  7. bootstrap + requireJS+ director+ knockout + web API = 一个时髦的单页程序

    也许单页程序(Single Page Application)并不是什么时髦的玩意,像Gmail在很早之前就已经在使用这种模式.通常的说法是它通过避免页面刷新大大提高了网站的响应性,像操作桌面应用程序 ...

  8. 使用RequireJS并实现一个自己的模块加载器 (一)

    RequireJS & SeaJS 在 模块化开发 开发以前,都是直接在页面上引入 script 标签来引用脚本的,当项目变得比较复杂,就会带来很多问题. JS项目中的依赖只有通过引入JS的顺 ...

  9. 使用gulp解决RequireJS项目前端缓存问题（二）

    1.前言 这一节,我们主要解决在上一节<使用gulp解决RequireJSs项目前端缓存问题(一)>末尾提到的几个问题: 对通过require-config.js引入的js文件修改后,没有 ...

随机推荐

  1. java实现第四届蓝桥杯空白格式化

    空白格式化 本次大赛采用了全自动机器测评系统. 如果你的答案与标准答案相差了一个空格,很可能无法得分,所以要加倍谨慎! 但也不必过于惊慌.因为在有些情况下,测评系统会把你的答案进行"空白格式 ...

  2. Java实现第八届蓝桥杯正则问题

    正则问题 考虑一种简单的正则表达式: 只由 x ( ) | 组成的正则表达式. 小明想求出这个正则表达式能接受的最长字符串的长度. 例如 ((xx|xxx)x|(x|xx))xx 能接受的最长字符串是 ...

  3. 【asp.net core 系列】6 实战之 一个项目的完整结构

    0. 前言 在<asp.net core 系列>之前的几篇文章中,我们简单了解了路由.控制器以及视图的关系以及静态资源的引入,让我们对于asp.net core mvc项目有了基本的认识. ...

  4. Mac卸载.net core sdk

    NET Core cli提供了卸载脚本 https://github.com/dotnet/cli/tree/master/scripts/obtain/uninstall dotnet-uninst ...

  5. CentOS7 yum 安装配置 MySQL 5.7

    1.配置yum源 # 下载mysql源安装包 wget http://dev.mysql.com/get/mysql57-community-release-el7-8.noarch.rpm # 安装 ...

  6. Flask 的请求与响应

    flask的请求与响应 from flask import Flask,request,make_response,render_template,redirect app = Flask(__nam ...

  7. Linux系统命令详解

    目录 1. su 1.1. su命令中passwd的自动输入 2. sshpass 3. locate/mlocate 4. top/htop 5. lftp 6. kill/killall 1. s ...

  8. 容器编排工具之Docker-compose

    前文我们聊了下docker私有仓库harbor的搭建,回顾请参考https://www.cnblogs.com/qiuhom-1874/p/13061984.html:在上一篇博客的末尾,我们简单聊了 ...

  9. @atcoder - AGC003F@ Fraction of Fractal

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定一个 H*W 黑白格图,保证黑格四连通. 定义分形如下:0 ...

  10. （十一）Maven运行TestNG的testcase 两种方式：testng.xml和testngCase.java

    原文:https://blog.csdn.net/wwhrestarting/article/details/46596869?utm_source=copy 1.通过maven-surefire-p ...