Įprasto JS pakrovimo trūkumai
Sąsaja turi pradėti atvaizduoti po to, kai js yra įkeltas
Jei tarp js yra priklausomybių, jas reikia įkelti eilės tvarka pagal priklausomybes. Jei priklausomybės yra sudėtingos, sunkiau rašyti ir prižiūrėti kodą
Taigi, require.js atsirado plačių žmonių masių balsu.
require.js vaidmuo
Įdiekite asinchroninį js įkėlimą, kad išvengtumėte puslapio nereagavimo
Valdykite modulių priklausomybes, kad palengvintumėte kodo rašymą ir priežiūrą
require.js pakrovimas
Pirmiausia eikite į [oficialią svetainę] http://requirejs.org/ atsisiųskite naujausią versiją
Įneškite atsisiųstą arba nukopijuotą require.js į projekto katalogą
Įkelkite require.js norimame puslapyje
Tiesioginė apkrova: Write <scrip{filter}t src="js/require.js"></scrip{filter}t>
Asinchroninis įkėlimas: <scrip{filter}t src="js/require.js" atidėti async="true" ></scrip{filter}t>
Pastaba: asinchroninis reiškia, kad šį failą reikia įkelti asinchroniškai, kad tinklalapis nereaguotų. IE nepalaiko asinchronizacijos, todėl įkelkite atributą atidėti;
Įkėlus require.js, kitas žingsnis yra įkelti savo kodą. Tarkime, kad mūsų pačių kodo failas yra main.js, taip pat patalpintas į js katalogą. Taigi, tiesiog parašykite: <scrip{filter}t src="js/require.js" data-main="js/main"></scrip{filter}t>
Atributo data-main funkcija yra nurodyti pagrindinį žiniatinklio programos modulį. Aukščiau pateiktame pavyzdyje šis failas pirmiausia bus įkeltas require.js main.js js kataloge. Kadangi numatytasis failo priesaga yra js require.js galite sutrumpinti main.js pagrindinį.
Kaip parašyti pagrindinį modulį
Ankstesnio skyriaus main.js vadinamas pagrindiniu moduliu. Tai reiškia viso modulio įvedimo būdą.
Kaip rašyti main.js
Metodai, parašyti tiesiai į main.js nepasikliaujant jokiais kitais moduliais
main.function()
Pagrindinis modulis priklauso nuo kitų modulių, todėl naudokite funkciją require()
main.js
require(['modulisA', 'modulisB', 'modulisC'], funkcija (modulisA, modulisB, modulisC){
šiek tiek kodo čia
});
Funkcija require() priima du parametrus:
Pirmasis parametras yra masyvas, vaizduojantis modulius, nuo kurių reikia priklausyti
Antrasis parametras yra atgalinio skambinimo funkcija, kuri bus iškviesta įkėlus visus priekyje nurodytus modulius. Pridėti moduliai perduodami parametrų pavidalu, kad juos būtų galima naudoti atgalinio skambinimo funkcijoje.
Modulių pakrovimas
Pavyzdys: jei pagrindinio modulio (main.js) priklausomas modulis yra ['jquery', 'crypto-js', 'anything']
Įkeliama pagal numatytuosius nustatymus
Jei šių trijų priklausomų modulių failai yra jquery.js, crypto-js.js, anything.js ir main.js tame pačiame kataloge, jie gali būti automatiškai įkelti pagal ankstesnį skyrių
Konfigūracijos apkrova require.config()
require.config() parašyta pagrindinio modulio (main.js) galvutėje.
Kaip rašomi AMD moduliai
require.js pakrautas modulis, naudojant AMD specifikaciją. Tai yra, modulis turi būti parašytas pagal AMD taisykles.
Konkrečiai, moduliai turi būti apibrėžti pagal konkrečią define() funkciją. Jei modulis nepriklauso nuo kitų modulių, jį galima apibrėžti tiesiogiai funkcijoje define()
Tarkime, kad dabar yra math.js failas, apibrėžiantis matematikos modulį. Tada math.js parašyti:
Štai kaip įkelti:
Jei modulis taip pat priklauso nuo kitų modulių, tada pirmasis funkcijos define() argumentas turi būti masyvas, nurodantis modulio priklausomybes.
Kai funkcija require() įkelia aukščiau pateiktą modulį, ji pirmiausia įkels myLib.js failą.
Įkelkite ne AMD modulius
Rinkoje yra daug modulių, kurie neatitinka AMD specifikacijos, require.js galima pakrauti
Prieš įkeliant šiuos modulius, juos reikia nustatyti į require.config(), kad būtų apibrėžtos kai kurios jų charakteristikos
Pavyzdžiui, noamd.js ir noamddeps.js abu moduliai yra ne AMD moduliai, o jei norite juos įkelti, turite apibrėžti jų charakteristikas:
require.js priima konfigūracijos objektą, kuris, be kelių ypatybės, taip pat turi shim savybę, skirtą konfigūruoti ne AMD modulius.
Konkrečiai, kiekvienas modulis apibrėžia:
- Eksporto vertė (išvesties kintamojo pavadinimas): nurodo modulio pavadinimą, kai jis iškviečiamas išoriškai
- deps masyvas: nurodo šio modulio priklausomybes
Pavyzdžiui, "jQuery" papildinį galima apibrėžti taip:
require.js įskiepis
require.js taip pat siūlo daugybę papildinių, kuriuose įdiegtos kai kurios specialios funkcijos
"domready" papildinys leidžia atgalinio skambinimo funkcijai paleisti įkėlus puslapio DOM struktūrą:
Teksto ir vaizdo įskiepiai, leidžiantys require.js įkelti teksto ir vaizdo failus:
Panašūs papildiniai yra JSON ir MDOWN, skirti įkelti JSON ir Markdown failus.
|
Paskelbta 2017-10-11 09:31:50
|
|
|
