http://www.requirejs.org/

http://www.requirejs.cn/

http://requirejs.readthedocs.org/en/1.0.1/

目录结构:

|-root
    |-demo
        |-js
            |-a.1.0.js
            |-a.1.1.js
            |-b.js
            |-c.js
            |-main.js
            |-util.js
        |-index.html
    |-libs
        |-requirejs
            |-require.js

文件下载

命名及代码都是随意写的,只为学习requirejs的写法.熟悉requirejs的用法.

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>requirejs demo</title>

	<style>

		div {

			padding: 5px 10px;

		}

	</style>

	<script type="text/javascript" src="../libs/requirejs/require.js" data-main="./js/main.js"></script>

</head>

<body>

	 <div id="Main" style="width:600px;height:400px;border:1px red solid;"></div>

</body>

</html>

//main.js

require.config({

	baseUrl: 'js', // or ./js //baseUrl是从index.html开始计算的.

	map: {

		'b': {

			'a': 'a.1.0'

		},

		'c': {

			'a': 'a.1.1'

		}

	}

});

require(['b','c'], function(b, c){

	b();

	c();

});

//a.1.0.js

define([], function(){

	function add(a, b){

		return a+b;

	}

	function mul(a, b){

		return a*b;

	}

	return {

		'add': add,

		'mul': mul

	}

});

//a.1.1.js

define([], function(){

	function add(a, b){

		return a+b+1000;

	}

	function mul(a, b){

		return a*b*100;

	}

	return {

		'add': add,

		'mul': mul

	}

});

//b.js

define(['a', 'util'], function(aa, util){

	function test(a, b){

		util.log('Main', 'add: ' + aa.add(a, b));

		util.log('Main', 'mul: ' + aa.mul(a, b));

	}

	return function(){test.call(this, 2, 3)};

});

//c.js

define(['a', 'util'], function(aa, util){

	function test(a, b){

		util.log('Main', 'add: ' + aa.add(a, b));

		util.log('Main', 'mul: ' + aa.mul(a, b));

	}

	return function(){test.call(this, 2, 3)};

});

//util.js

define([], function(){

	// var __id = '';

	// var __tar = null;

	// function setId(id){

		// __id = id;

	// }

	// function _getEl(){

		// return document.getElementById(__id);

	// }

	function log(id, content){

		//var tar = __tar || __tar = _getEl();

		var tar = document.getElementById(id);

		var old = tar.innerHTML;

		tar.innerHTML = old + '<br>' + content;

	}

	return {

		'log': log

	};

});

开始时,把paths理解为map了.后来出现错误,再去查API时才发现.(而且将paths误写成了path)

开始时,我在b.js和c.js中都写了require.config({...}),并将path(s)分别设置为 'a': 'a.1.0' 和 'a': 'a.1.1' <- 这显然是错误.

最开始时baseUrl也配置错误了.截图下来了.

requirejs实验001.对我来说,用AMD的方式来组织代码并不轻松.的更多相关文章

  1. requirejs实验002. r.js合并文件. 初体验.

    requirejs的官网上有介绍如何使用r.js合并,压缩文件的.http://requirejs.org/docs/optimization.html https://github.com/jrbu ...

  2. Matlab与C/C++联合编程之Matlab以MEX方式调用C代码（五）完整过程加示

    如下为本人亲证代码: 一: 编译器的安装与配置(环境不同,显示结果不同) 要使用MATLAB编译器,用户计算机上应用事先安装与MATLAB适配的以下任何一种ANSI C/C++编译器: 5.0.6.0 ...

  3. weimi 短信API post方式的简易代码。

    http://www.weimi.cc/example-csharp.html string mobile = "<enter your mobiles>", con ...

  4. repo+manifests+git方式管理安卓代码

    repo+manifests+git方式管理安卓代码 1.repo的获取 repo只是google用Python脚本写的调用git的一个脚本,主要是用来下载.管理Android项目的软件仓库.(也就是 ...

  5. Linux - Redmine使用方式 | SVN提交代码

    Redmine使用方式 | SVN提交代码 本文地址:http://blog.csdn.net/caroline_wendy RbTools 1. 安装: svn co https://dev.cxx ...

  6. react-native-pg-style使用方法(以最简单的方式编写样式代码,抛弃react-native标准的样式创建方式.)

    react-native-pg-style 以最简单的方式编写样式代码,抛弃react-native标准的样式创建方式. 看大家写的源码中都是按照react-native标准的样式创建方式来写样式代码 ...

  7. Spring MVC 实验2-Bean的几种装配方式及基本用法

    实验二:Bean的几种装配方式及基本用法  实验目的: (1)掌握2种基于XML的装配方式:设值注入(Setter Injection)和构造注入(Constructor Injection) . ( ...

  8. 实验一：使用ADO.NET方式读数据

    第一步:创建Asp.net应用程序 在VS中,点击文件->新建->项目,按如图方式选择并输入: 第二步:新建产品浏览网页窗体Listing.aspx: 在项目SportsStoreEx上点 ...

  9. ELK学习实验001：Elastic Stack简介

    1 背景介绍 在我们日常生活中,我们经常需要回顾以前发生的一些事情:或者,当出现了一些问题的时候,可以从某些地方去查找原因,寻找发生问题的痕迹.无可避免需要用到文字的.图像的等等不同形式的记录.用计算 ...

随机推荐

  1. Codeforces Gym 100610 Problem A. Alien Communication Masterclass 构造

    Problem A. Alien Communication Masterclass Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://codefo ...

  2. 使用CKEditor编辑器进行文本编辑

    首先下载CKEditor. 下载地址:点击打开链接 将下载完的CKEditor解压而且导入到项目中. 然后在页面引入CKEditor <script type="text/javasc ...

  3. 【剑指offer】近期公共祖先

    转载请注明出处:http://blog.csdn.net/ns_code/article/details/28113959 剑指offer上的最后一题了,一个递归函数调了一下午,才得到正确的结果. 题 ...

  4. Asp.Net页面(母版页)加载顺序

    ASP.NET 母版页和内容页中的事件 母版页和内容页都可以包含控件的事件处理程序.对于控件而言,事件是在本地处理的,即内容页中的控件在内容页中引发事件,母版页中的控件在母版页中引发事件.控件事件不会 ...

  5. 自己动手写CPU之第九阶段（8）——MIPS32中的LL、SC指令说明

    将陆续上传新书<自己动手写CPU>,今天是第47篇. 9.7 ll.sc指令实现思路 9.7.1 实现思路 这2条指令都涉及到訪问链接状态位LLbit,能够将LLbit当做寄存器处理,ll ...

  6. focusky

    Focusky,是一款新型多媒体幻灯片制作软件,操作便捷性以及演示效果超越PPT,主要通过缩放.旋转.移动动作使演示变得生动有趣.传统PPT单线条时序,只是一张接一张切换播放,而Focusky打破常规 ...

  7. PHP做好防盗链的基本思想 防盗链的设置方法

    盗链是指服务提供商自己不提供服务的内容,通过技术手段绕过其它有利益的最终用户界面(如广告),直接在自己的网站上向最终用户提供其它服务提供商的服务内容,骗取最终用户的浏览和点击率.受益者不提供资源或提供 ...

  8. wpf linq数据库无法插入

    最近做wpf应用程序,遇到一个很奇怪的问题,我用代码往数据库里插入数据成功了,但去vs的服务器资源管理器里查看数据库总是最开始的样子,什么都没有插入进去,然后就检查代码,打日志查看sql语句,发现都没 ...

  9. #pragma_pack(n)_与___attribute(aligned(n))

    #pragma pack(n) 与 __attribute(aligned(n))   在C语言中,结构是一种复合数据类型,其构成元素既可以是基本数据类型(如int.long.float等)的变量,也 ...

  10. java_小技巧

    看很多人说,在Eclipse里面,输入Syso然后按 ALT+/不起作用. 正确的用法如下,先输入一行 System.out.println(); 然后连按5次以上shift键,其实就是粘滞的功能.接 ...