requireJs学习笔记(一)

概念

是一个模块载入框架，AMD规范的实现

优势

• 防止js加载阻塞页面渲染
• 使用程序调用方式加载js

API

• define 定义模块
• require 加载模块

示例

define(function(){ 
    function fun1(){ 
       alert("it works"); } 
     fun1();
})

require(["js/a"],function(){ 
  alert("load finished");
})

加载文件

//config:给模块起一个更短更好记的名字
require.config({ 
  paths : { 
    //cdn库没有加载成功时，加载本地库
    "jquery" : ["http://libs.baidu.com/jquery/2.0.3/jquery", "js/jquery"],  
    "a" : "js/a" 
  }
})
//不需写后缀.js,$为jquery的输出变量
require(["jquery","a"],function($, a){ 
  $(function(){ 
    alert("load finished"); 
  })
})

使用

• 上面的例子中重复出现了require.config配置，如果每个页面中都加入配置，必然显得十分不雅，requirejs提供了一种叫"主数据"的功能，我们首先创建一个main.js:
  require.config({
  paths : {
  "jquery" : ["http://libs.baidu.com/jquery/2.0.3/jquery", "js/jquery"],
  "a" : "js/a"
  }
  })
• 然后再页面中使用下面的方式来使用requirejs：