modJS前端模塊加載解決方案
modJS 是一套的前端模塊加載解決方案。與傳統(tǒng)的模塊加載相比，modJS 會(huì)根據(jù)產(chǎn)品實(shí)際使用場(chǎng)景，自動(dòng)選擇一種相應(yīng)的方案，使最終的實(shí)現(xiàn)非常輕量簡(jiǎn)潔。
使用
模塊的定義
modJS是一個(gè)精簡(jiǎn)版的AMD/CMD規(guī)范，并不完全遵守AMD/CMD規(guī)范，目的在于希望給使用者提供一個(gè)類似nodeJS一樣的開(kāi)發(fā)體驗(yàn)，同時(shí)具備很好的線上性能。
使用define來(lái)定義一個(gè)模塊：
define (id, factory)
在平常開(kāi)發(fā)中，我們只需寫factory中的代碼即可，無(wú)需手動(dòng)定義模塊。發(fā)布工具會(huì)自動(dòng)將模塊代碼嵌入factory的閉包里。
factory提供了3個(gè)參數(shù)：require, exports, module，用于模塊的引用和導(dǎo)出。
-
modJS的發(fā)布工具會(huì)保證你的程序在使用之前，所有依賴的模塊都已加載。因此當(dāng)我們需要一個(gè)模塊時(shí)，只需提供一個(gè)模塊名即可獲?。?/p>
require (id)
和NodeJS里獲取模塊的方式一樣，非常簡(jiǎn)單。
因?yàn)樗璧哪K都已預(yù)先加載，因此require可以立即返回該模塊。
-
考慮到有些模塊無(wú)需在啟動(dòng)時(shí)載入，因此modJS提供了可以在運(yùn)行時(shí)異步加載模塊的接口：
require.async (names, onload, onerror)
names可以是一個(gè)模塊名，或者是數(shù)組形式的模塊名列表。
當(dāng)所有都加載都完成時(shí)，onload被調(diào)用，names對(duì)應(yīng)的所有模塊實(shí)例將作為參數(shù)傳入。
如果加載錯(cuò)誤或者網(wǎng)絡(luò)超時(shí)，onerror將被觸發(fā)。
超時(shí)時(shí)間可以通過(guò)require.timeout設(shè)置，默認(rèn)為5000(ms)。
使用require.async獲取的模塊不會(huì)被發(fā)布工具安排在預(yù)加載中，因此在完成回調(diào)之前require將會(huì)拋出模塊未定義錯(cuò)誤。
require.loadJs (url)
異步加載腳本文件，不做任何回調(diào)
require.loadCss ({url: cssfile})
異步加載CSS文件，并添加到頁(yè)面
require.loadCss ({content: csstext})
創(chuàng)建一個(gè)樣式列表并將css內(nèi)容寫入
說(shuō)明
modJS只實(shí)現(xiàn)了AMD的一個(gè)子集，如果需要使用完整兼容AMD規(guī)范的版本，請(qǐng)使用amd目錄下的esl-mod.js，這個(gè)版本是基于esl版本基礎(chǔ)之上實(shí)現(xiàn)了fis的需求。