首页 > 代码库 > Seajs教程

Seajs教程

API 快速参考

该页面列举了 Sea.js 的常用 API。只要掌握这些用法,就可以娴熟地进行模块化开发。

 

seajs.config

用来对 Sea.js 进行配置。

seajs.config({

 

  // 设置路径,方便跨目录调用

  paths: {

    ‘arale‘: ‘https://a.alipayobjects.com/arale‘,

    ‘jquery‘: ‘https://a.alipayobjects.com/jquery‘

  },

 

  // 设置别名,方便调用

  alias: {

    ‘class‘: ‘arale/class/1.0.0/class‘,

    ‘jquery‘: ‘jquery/jquery/1.10.1/jquery‘

  }

 

});

seajs.use

用来在页面中加载一个或多个模块。

// 加载一个模块

seajs.use(‘./a‘);

 

// 加载一个模块,在加载完成时,执行回调

seajs.use(‘./a‘, function(a) {

  a.doSomething();

});

 

// 加载多个模块,在加载完成时,执行回调

seajs.use([‘./a‘, ‘./b‘], function(a, b) {

  a.doSomething();

  b.doSomething();

});

 

define

用来定义模块。Sea.js 推崇一个模块一个文件,遵循统一的写法:

define(function(require, exports, module) {

 

  // 模块代码

 

});

 

require, exports 和 module 三个参数可酌情省略,具体用法如下。

require

require 用来获取指定模块的接口。

define(function(require) {

 

  // 获取模块 的接口

  var a = require(‘./a‘);

 

  // 调用模块 的方法

  a.doSomething();

});

 

require.async

用来在模块内部异步加载一个或多个模块。

define(function(require) {

 

  // 异步加载一个模块,在加载完成时,执行回调

  require.async(‘./b‘, function(b) {

    b.doSomething();

  });

 

  // 异步加载多个模块,在加载完成时,执行回调

  require.async([‘./c‘, ‘./d‘], function(c, d) {

    c.doSomething();

    d.doSomething();

  });

 

});

 

exports

用来在模块内部对外提供接口。

define(function(require, exports) {

 

  // 对外提供 foo 属性

  exports.foo = ‘bar‘;

 

  // 对外提供 doSomething 方法

  exports.doSomething = function() {};

 

});

 

module.exports

与 exports 类似,用来在模块内部对外提供接口。

define(function(require, exports, module) {

 

  // 对外提供接口

  module.exports = {

    name: ‘a‘,

    doSomething: function() {};

  };

 

});

SeaJS使用说明

 

在页面中加载模块

在 hello.html 页尾,通过 script 引入 sea.js 后,有一段配置代码: 

// seajs 的简单配置

seajs.config({

  base: "../sea-modules/",

  alias: {

    "jquery": "jquery/jquery/1.10.1/jquery.js"

  }

})

 

// 加载入口模块

seajs.use("../static/hello/src/main")

sea.js 在下载完成后,会自动加载入口模块。页面中的代码就这么简单。 

模块代码

这个小游戏有两个模块 spinning.js 和 main.js,遵循统一的写法: 

// 所有模块都通过 define 来定义

define(function(require, exports, module) {

 

  // 通过 require 引入依赖

  var $ = require(‘jquery‘);

  var Spinning = require(‘./spinning‘);

 

  // 通过 exports 对外提供接口

  exports.doSomething = ...

 

  // 或者通过 module.exports 提供整个接口

  module.exports = ...

 

});

 

Seajs教程