插件開發(fā)指南

Sea.js 通過事件提供可擴展接口。要給 Sea.js 開發(fā)插件，需要了解 Sea.js 內部所提供的事件類型。

事件機制

Sea.js 內置了一個非常小巧的 Pub-Sub 機制。API 簡要如下：

seajs.on seajs.on(event, callback)

用來添加事件回調。

// 給 fetch 事件添加一個回調seajs.on('fetch', function(data) {
  ...
});

seajs.off seajs.off(event?, callback?)

用來移除事件回調。

// 從 fetch 事件的回調中移除掉 fn 函數(shù)seajs.off('fetch', fn);// 移除掉 fetch 事件的所有回調seajs.off('fetch');// 移除掉所有事件的所有回調seajs.off();

seajs.emit seajs.emit(event, data)

用來觸發(fā)事件。

// 觸發(fā) fetch 事件seajs.emit('fetch', { uri: uri, fetchedList: fetchedList });

利用以上三個方法，我們就可以給 Sea.js 添加事件來實現(xiàn)擴展了。

事件類型

Sea.js 內部提供了 8 種事件。

resolve       -- 將 id 解析成為 uri 時觸發(fā)
load          -- 開始加載文件時觸發(fā)
fetch         -- 具體獲取某個 uri 時觸發(fā)
request       -- 發(fā)送請求時觸發(fā)
define         -- 執(zhí)行 define 方法時觸發(fā)
exec         -- 執(zhí)行 module.factory 時觸發(fā)
config         -- 調用 seajs.config 時觸發(fā)
error          -- 加載腳本文件出現(xiàn) 404 或其他錯誤時觸發(fā)

每個事件觸發(fā)時會帶上相關聯(lián)的數(shù)據(jù)，比如

  // Emit `fetch` event for plugins such as plugin-combo
  var data = { uri: uri }
  emit("fetch", data)

上面是觸發(fā) fetch 事件的源碼。訂閱的 callback 回調會接受到 data 參數(shù)：

seajs.on('fetch', function(data) {  if (data.uri) {
    data.requestUri = data.uri + '?t=' + new Date().getTime()
  }
});

上面就實現(xiàn)了一個最簡單的 nocache 插件。

每一個事件發(fā)送的具體數(shù)據(jù)參數(shù)，請在源碼中用事件名搜索相關代碼就好。

內部數(shù)據(jù)與方法

seajs.data Object

通過 data 接口，你幾乎可以獲取了 Sea.js 內部的所有配置數(shù)據(jù)和核心內部數(shù)據(jù)。

seajs.Module Object

通過 Module 接口，你幾乎可以獲取了 Sea.js 內部的所有核心方法。

有了 data 和 Module，以及前面的事件接口，插件開發(fā)者就可以開發(fā)出各種插件了。推薦訪問https://github.com/seajs 查看所有插件?？匆粌蓚€插件的源碼后，我相信你很快也就能開發(fā)出自己的插件。

插件的加載方式

#794

小結

事件機制非常靈活。如果在實際使用中發(fā)現(xiàn)有什么不妥，歡迎提供建議一起來完善。