require.js的简单使用

Posted 快乐~

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了require.js的简单使用相关的知识,希望对你有一定的参考价值。

<script src="js/require.js"></script>

<script src="js/require.js" data-main="js/main"></script>

 

 

require([‘jquery‘, ‘underscore‘, ‘backbone‘], function ($, _, Backbone){

    // some code here

  });

 

使用require.config()方法,我们可以对模块的加载行为进行自定义。require.config()就写在主模块(main.js)的头部。参数就是一个对象,这个对象的paths属性指定各个模块的加载路径。

  require.config({

    paths: {

      "jquery": "jquery.min",
      "underscore": "underscore.min",
      "backbone": "backbone.min"

    }

  });

 

 require.config({

    baseUrl: "js/lib",

    paths: {

      "jquery": "jquery.min",
      "underscore": "underscore.min",
      "backbone": "backbone.min"

    }

  });

 

require.config({

    paths: {

      "jquery": "https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min"

    }

  });

 

假定现在有一个math.js文件,它定义了一个math模块。那么,math.js就要这样写:

  // math.js

  define(function (){

    var add = function (x,y){

      return x+y;

    };

    return {

      add: add
    };

  });

加载方法如下:

  // main.js

  require([‘math‘], function (math){

    alert(math.add(1,1));

  });

如果这个模块还依赖其他模块,那么define()函数的第一个参数,必须是一个数组,指明该模块的依赖性。

  define([‘myLib‘], function(myLib){

    function foo(){

      myLib.doSomething();

    }

    return {

      foo : foo

    };

  });

当require()函数加载上面这个模块的时候,就会先加载myLib.js文件。

 

以上是关于require.js的简单使用的主要内容,如果未能解决你的问题,请参考以下文章

requirejs简单应用

requireJs--简单的使用方法

js模块化和使用

Sea.js & Require.js

学习 | 基于require.js的三级联动菜单入门

xml2js:输出如何?