码迷,mamicode.com
首页 > Web开发 > 详细

requirejs之demo

时间:2015-08-31 18:59:39      阅读:192      评论:0      收藏:0      [点我收藏+]

标签:

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

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

标签:

原文地址:http://www.cnblogs.com/benchan2015/p/requireJs.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!