Balenie požiadaviek modulov RequireJS "text!" - knockout.js, requjs, durandal, viazanie a minifikácia, r.js

Snažím sa zistiť, či (a ako, ak je to možné) použiť Optimalizačný nástroj RequireJS zahrnúť nielen moje moduly JavaScript, ale aj môj "text!" moduly. Pracujem na aplikácii Durandal, ktorá používa moduly "text!" Pre zobrazenia.

Niekedy máme používateľov, ktorí dostanú časový limit, ktorý sa snaží načítať zobrazenie. Tu je príklad chyby:

Error: Load timeout for modules: text!views/primaryapplicants.html
http://requirejs.org/docs/errors.html#timeout

Mám ešte ďalšiu otázku, ktorú som práve vyslovil o tom, že ste vyriešili tento časový limit, Nemôžem zistiť, ako to zachytiť a skúsiť znova Viem, že definícia modulu je platná, je to len to, že zákazníci môžu mať problém s pripojením k sieti - najmä ak sú na mobilnom telefóne.

Keďže som však pokračoval v rozmýšľaní o tom, jauvedomte si, že ak by som mohol jednoducho baliť celú aplikáciu do jedného súboru, potom by sme sa mohli vyhnúť ďalším HTTP hovorom - čo by mohlo znížiť časové limity ako je tento. Znamená to, že aplikácia sa načíta, alebo nie - namiesto možnosti "čiastočného" načítania.

Táto aplikácia nemá veľký počet zobrazení. Odhadujem, že pridanie každého zobrazenia by pridaním približne 20 kb s kompresiou gzip.

Takže je možné baliť tieto "text!" moduly nejako?

odpovede:

K dispozícii je inlineText vytvoriť konfiguráciu (v predvolenom nastavení je to pravé), čo inštruuje optimalizátor, aby urobil presne to, čo chcete. Jednou výzvou je, že rovnako ako v prípade akéhokoľvek iného modulu budú detegovať len závislosti, ktoré sú špecifikované v niektorých moduloch define() blok. Inými slovami, nebude schopný zistiť text! ktoré sa vyžadujú na požiadanie, ak sa to nedá explicitne dosiahnuť - a práve tu leží váš problém.

Jedno riešenie (ďaleko od ideálneho, ak máte veľa súborov na prezeranie) by bolo špecifikovať každý jeden text! závislosť, ktorú používate v include voľba v konfigurácii konfigurácie, napr .:

// ...
include: ["text!views/primaryapplicants.html",
"text!views/secondaryapplicants.html",
// etc.
]
// ...

Možno budete chcieť dať Weyland, Durandalov optimalizátor skúste. Príklad konfigurácie weyland-config.js možno nájsť v HTML StarterKit.

https://github.com/BlueSpire/Durandal/blob/master/platforms/HTML/StarterKit/weyland-config.js

exports.config = function(weyland) {
weyland.build("main")
.task.jshint({
include:"app/**/*.js"
})
.task.uglifyjs({
include:["app/**/*.js", "lib/durandal/**/*.js"]
})
.task.rjs({
include:["app/**/*.{js,html}", "lib/durandal/**/*.js"],
loaderPluginExtensionMaps:{
".html":"text"
},
rjs:{
name:"../lib/require/almond-custom", //to deploy with require.js, use the build"s name here instead
insertRequire:["main"], //not needed for require
baseUrl : "app",
wrap:true, //not needed for require
paths : {
"text": "../lib/require/text",
"durandal":"../lib/durandal/js",
"plugins" : "../lib/durandal/js/plugins",
"transitions" : "../lib/durandal/js/transitions",
"knockout": "../lib/knockout/knockout-2.3.0",
"bootstrap": "../lib/bootstrap/js/bootstrap",
"jquery": "../lib/jquery/jquery-1.9.1"
},
inlineText: true,
optimize : "none",
pragmas: {
build: true
},
stubModules : ["text"],
keepBuildDir: true,
out:"app/main-built.js"
}
});
}