前言：requirejs已经使用多时，但是一直没时间去学习，框架都是别人搭好的，所以我在这里从头开始学习一下requirejs(本人是前端小白，这里只是当做个人的记录，不喜勿喷！)
requirejs的准备工作很简单，只需要下载了requirejs的代码，像普通js那样使用就可以了
一、
首先介绍下自己的文件结构：
贴出html页面全部代码：
<!DOCTYPE html> <html> <head> <meta charset = "utf-8"/> <title>require</title> <script data-main="js/main" src="js/require.min.js" data-view="lam1"></script> </head> <body> <div class="demo">requirejs-demo</div> <div class="lam1" id="lam1" data-test="lam">lam1-demo</div> <div class="lam2" id="lam2">lam1-demo</div> </body> </html>
1、引入：<script data-main="js/main" src="js/require.min.js" data-view="lam1"></script>
这里还有一个属性：
<script src="js/require.js" defer async="true" ></script>
async属性表明这个文件需要异步加载，避免网页失去响应。IE不支持这个属性，只支持defer，所以把defer也写上。
2、处理main.js,先配置：
// 定义加载的js require.config({ /*baseUrl : ‘‘, //有这个就默认在项目的根目录下，没有就是当前目录*/ shim : { ‘Jquery‘ : { exports : ‘$‘} //不写这个juqery用不了，exports值（输出的变量名） }, paths : { Jquery : ‘jquery-1.11.1‘ } })
require.config()接受一个配置对象，这个对象除了有前面说过的paths属性之外，还有一个shim属性，专门用来配置不兼容的模块。具体来说，每个模块要定义（1）exports值（输出的变量名），表明这个模块外部调用时的名称；（2）deps数组，表明该模块的依赖性。(此句引自阮一峰关于requirejs的文章)
3、写自己的main函数：
require([‘Jquery‘,‘lam2‘],function($,lam){ $(".demo").css("color","blue"); //查看是否要引入js,如果script标签里面有data-view属性，则引入 if($(‘script[data-view]‘).attr(‘data-view‘) == ‘no‘){ return; }else if($(‘script[data-view]‘).attr(‘data-view‘)){ //引入lam1.js文件 require([$(‘script[data-view]‘).attr(‘data-view‘)]); }else{ return; } lam.changered("lam2"); })
lam2是我自己定义的一个对象，代码如下：
define([‘Jquery‘],function($){ var lam = { changered: function(id){ $("#"+id).css("color","red"); } } return lam; })
这里说明一下，requirejs如何自己定义函数，使用define（[“这里填入自己需要依赖的框架”],function("这里是使用框架的名字，Jquery则是$"){"这里创建自己的对象" “最后一定要return对象才能使用”}）;
4、使用requirejs的方法很简单，只需要在代码的前面require就可以了（下面是lam1的代码）：
require([‘Jquery‘],function($){
//引入了jquery，只要使用就可以了。 $(‘.lam1‘).css("color",‘green‘); })
总结：requirejs就是模块化开发而已，操作很简单，①无非是怎么使用其他写好的js：使用require即可，②怎么定义自己的对象，以便以后使用：使用define.....return
原文：http://www.cnblogs.com/kangmingwei/p/5161011.html