Usage-1.1加載JavaScript文件

RequireJS采用與傳統(tǒng)的<script>標(biāo)簽不同的方式來(lái)加載腳本文件。然而,這樣的方式依然可以以最優(yōu)的性能快速運(yùn)行心赶,這種方式的主要目標(biāo)是鼓勵(lì)代碼的模塊化。鼓勵(lì)使用模塊ID而非腳本便簽內(nèi)的ULR也是這種方式的組成部分缺猛。

RequireJS根據(jù)基URL來(lái)加載所有的代碼缨叫。基URL一般情況下被默認(rèn)為data-main屬性中指定腳本所在的目錄荔燎,該腳本是為頁(yè)面而加載的頂級(jí)腳本耻姥。data-main屬性是一個(gè)特殊的屬性,require.js將會(huì)檢查并開(kāi)始加載該腳本文件有咨。以下示例將以一個(gè)腳本的基URL結(jié)束:

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

或者咏闪,你可以手動(dòng)地在RequireJS config當(dāng)中設(shè)置。如果沒(méi)有顯式的配置文件以及data-main被使用摔吏,那么基URL將默認(rèn)為運(yùn)行RequireJS的文檔所在的目錄鸽嫂。

RequireJS同時(shí)也假設(shè)默認(rèn)情況下所有的依賴(lài)都是腳本文件,因此征讲,你不需要在模塊ID上加上.js后綴据某。RequireJS在將模塊ID轉(zhuǎn)換為路徑時(shí),自動(dòng)為其加上默認(rèn)擴(kuò)展名诗箍。通過(guò)使用paths config癣籽,你可以建立起一組腳本文件的位置。所有的這些功能使得你輸入地更少滤祖。

可能有些時(shí)候你想直接引用一個(gè)腳本文件筷狼,而不遵循“baseURL+paths”。如果一個(gè)模塊ID中有一下的字符之一的匠童,該ID將不會(huì)使用“baseURL+paths”配置來(lái)傳遞埂材,僅僅將其視為普通的URL:

  • 以“.js”結(jié)尾
  • 以“/”開(kāi)頭
  • 包含一個(gè)URL協(xié)議,例如“http:”汤求、“https”

一般情況下俏险,最好使用基URL以及“paths”配置來(lái)為模塊ID設(shè)立路徑。通過(guò)這樣做扬绪,今后你在重命名以及為優(yōu)化版本配置不同的路徑時(shí)竖独,將更加的靈活方便。

相似地挤牛,為了避免一連串連鎖配置莹痢,最好避免為腳本設(shè)置過(guò)深的目錄,而是采用基Url墓赴,或者你想通過(guò)將你的應(yīng)用代碼與庫(kù)代碼或者是組建代碼分隔開(kāi)來(lái)竞膳,你可以使用以下目錄布局:

www/
??|--- index.html
??|--- js/
????|--- app/
??????|---sub.js
????|--- lib/
??????|--- jquery.js
??????|--- canvas.js
????|--- app.js
????|--- require.js

在index.html中:

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

在app.js中:

requirejs.config({ //默認(rèn)情況下會(huì)在js/lib目錄下加載任何模塊ID baseUrl:'js/lib', //除非模塊ID使用‘‘a(chǎn)pp’’開(kāi)頭,從js/app目錄中加載它竣蹦。 //路徑配置是相對(duì)于基Url顶猜,而且不會(huì)包含任何的擴(kuò)展 //名'.js',因?yàn)槁窂脚渲檬菫榱四夸?path:{ app:'.../app' } }); //主要應(yīng)用邏輯開(kāi)始 requirejs(['jquery','canvas','app/sub'], function($, canvas, sub){ //jQuery, canvas and the app/sub模塊全部能被加載并能在此被使用 });

作為示例的一部分痘括,這些組件庫(kù)长窄,例如jQuery在它們的文件名當(dāng)中都沒(méi)有出現(xiàn)版本數(shù)字。如果你想追蹤版本纲菌,我們推薦將版本信息保存在單獨(dú)的文本文件中挠日,或者你可以使用像volo這類(lèi)工具,這類(lèi)工具將會(huì)建立起一個(gè)保存有版本信息的package.json文件在硬盤(pán)上翰舌。這樣你就可以進(jìn)行非常微小的配置嚣潜,而不是為每個(gè)庫(kù)在配置中建立起單獨(dú)的入口。例如椅贱,配置'jquery'為'jquery-1.7.2'懂算。

理想情況下只冻,你所加載的模塊將成為模塊,這些模塊通過(guò)調(diào)用define()函數(shù)來(lái)定義计技。然而喜德,你可能需要使用一些傳統(tǒng)的‘瀏覽器全局’腳本,這些腳本不會(huì)使用define()來(lái)定義他們的依賴(lài)垮媒。出于這個(gè)目的舍悯,你可以使用shim config。該工具能夠很好地表述他們的依賴(lài)睡雇。

如果你表述依賴(lài)萌衬,你很可能會(huì)遇到加載錯(cuò)誤,因?yàn)镽equireJS為了加快加載速度它抱,將異步無(wú)序地加載腳本文件秕豫。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市抗愁,隨后出現(xiàn)的幾起案子馁蒂,更是在濱河造成了極大的恐慌,老刑警劉巖蜘腌,帶你破解...
    沈念sama閱讀 219,427評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件沫屡,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡撮珠,警方通過(guò)查閱死者的電腦和手機(jī)沮脖,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,551評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)芯急,“玉大人勺届,你說(shuō)我怎么就攤上這事∪⑺#” “怎么了免姿?”我有些...
    開(kāi)封第一講書(shū)人閱讀 165,747評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)榕酒。 經(jīng)常有香客問(wèn)我胚膊,道長(zhǎng),這世上最難降的妖魔是什么想鹰? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,939評(píng)論 1 295
  • 正文 為了忘掉前任紊婉,我火速辦了婚禮,結(jié)果婚禮上辑舷,老公的妹妹穿的比我還像新娘喻犁。我一直安慰自己,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,955評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布肢础。 她就那樣靜靜地躺著还栓,像睡著了一般。 火紅的嫁衣襯著肌膚如雪传轰。 梳的紋絲不亂的頭發(fā)上蝙云,一...
    開(kāi)封第一講書(shū)人閱讀 51,737評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音路召,去河邊找鬼。 笑死波材,一個(gè)胖子當(dāng)著我的面吹牛股淡,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播廷区,決...
    沈念sama閱讀 40,448評(píng)論 3 420
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼唯灵,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了隙轻?” 一聲冷哼從身側(cè)響起埠帕,我...
    開(kāi)封第一講書(shū)人閱讀 39,352評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎玖绿,沒(méi)想到半個(gè)月后敛瓷,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,834評(píng)論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡斑匪,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,992評(píng)論 3 338
  • 正文 我和宋清朗相戀三年呐籽,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片蚀瘸。...
    茶點(diǎn)故事閱讀 40,133評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡狡蝶,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出贮勃,到底是詐尸還是另有隱情贪惹,我是刑警寧澤,帶...
    沈念sama閱讀 35,815評(píng)論 5 346
  • 正文 年R本政府宣布寂嘉,位于F島的核電站奏瞬,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏垫释。R本人自食惡果不足惜丝格,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,477評(píng)論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望棵譬。 院中可真熱鬧显蝌,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,022評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至骆撇,卻和暖如春瞒御,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背神郊。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,147評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工肴裙, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人涌乳。 一個(gè)月前我還...
    沈念sama閱讀 48,398評(píng)論 3 373
  • 正文 我出身青樓蜻懦,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親夕晓。 傳聞我的和親對(duì)象是個(gè)殘疾皇子宛乃,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,077評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容