AMD规范-require.js使用

AMD规范

• 主要实践者: require.js
• require.config()指定引用路径等
• define()定义模块
• require()加载模块

define()定义一个普通AMD模块

// math.js
define(function(){
  var add = function(x,y){
    return x+y;
  }
  return {
    add: add
  }
})

require()加载模块

1. 在html页面中加载主模块

   <script src="js/require.js" data-main="js/main"></script>
   <!-- data-main属性: 指定主模块, js/main.js 这个文件会被require.js第一个加载 -->

2. 在主模块/js/main.js中配置依赖模块

   // /js/main.js
   // 配置项: 可以指定模块文件的路径
    require.config({
      baseUrl: "js/lib",// 所有模块都从该路径下加载
      paths: {
        "jquery": "jquery.min",
        "underscore": "underscore.min",
        "backbone": "backbone.min"
      }
    });
   
   // AMD规范的require()函数
   // 第一个参数: 数组(表示依赖的模块)
   // 第二个参数: 回调函数(当前面指定的模块加载成功后调用)
   require(['jquery', 'underscore', 'backbone'], function ($, _, Backbone){
    // require.js会先加载jQuery、underscore和backbone，然后再运行回调函数
    // 主模块代码就写在这个回调函数中
   });