/ / पैकेजिंग की आवश्यकता हैजेजेएस "पाठ!" मॉड्यूल - पीटकर

RequJS "टेक्स्ट!" मॉड्यूल को पैकेजिंग - knockout.js, requjs, durandal, bundling-and-minification, r.js

मैं अगर (और कैसे, अगर यह संभव है) का उपयोग करने की कोशिश कर रहा हूँ आवश्यकता है अनुकूलन उपकरण न केवल मेरे जावास्क्रिप्ट मॉड्यूल, बल्कि मेरे "पाठ!" मॉड्यूल। मैं विचारों के लिए "पाठ!" मॉड्यूल का उपयोग करने वाले एक Durandal ऐप पर काम कर रहा हूं।

कभी-कभी हमारे पास ऐसे उपयोगकर्ता होते हैं जो किसी दृश्य को लोड करने का प्रयास करते हुए टाइमआउट प्राप्त करते हैं। यहाँ एक उदाहरण त्रुटि है:

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

मैं एक और सवाल है कि मैं सिर्फ उस समय से निपटने के बारे में पोस्ट किया है। मैं यह पता लगा सकता हूं कि इसे कैसे रोकना है और फिर से प्रयास करना है। मुझे पता है कि मॉड्यूल परिभाषा वैध है, यह सिर्फ इतना है कि ग्राहकों को नेटवर्क कनेक्टिविटी समस्या हो सकती है - खासकर अगर वे एक सेल फोन पर हैं।

हालाँकि, जैसा कि मैंने "यह विचार करना जारी रखा, मैंएहसास है कि अगर मैं बस एक ही फ़ाइल में पूरे ऐप को पैकेज कर सकता हूं, तो हम अतिरिक्त HTTP कॉल से बच सकते हैं - जो इस तरह टाइमआउट में कटौती कर सकते हैं। इसका मतलब होगा कि ऐप या तो लोड होता है, या यह "आंशिक रूप से" लोड होने की संभावना के बजाय t "नहीं है।

इस ऐप में बड़ी संख्या में दृश्य नहीं हैं। मुझे लगता है कि हर दृश्य को जोड़ने के बारे में 20kb gzip संपीड़न के साथ जोड़ देगा।

तो, क्या इन "पाठ" को पैकेज करना संभव है! किसी तरह मॉड्यूल?

उत्तर:

उत्तर № 1 के लिए 1

वहाँ है inlineText विन्यास विकल्प का निर्माण (डिफ़ॉल्ट रूप से सही) जो ऑप्टिमाइज़र को निर्देश देता है कि आप जो चाहते हैं, वही करें। एक चेतावनी यह है कि यह किसी भी अन्य मॉड्यूल की तरह होगा, केवल कुछ मॉड्यूल में निर्दिष्ट निर्भरता का पता लगाएगा define() ब्लॉक। दूसरे शब्दों में, यह "टी का पता लगाने में सक्षम है text! जब तक वे मांग पर निर्भर नहीं होते हैं, तब तक वे स्पष्ट रूप से उपलब्ध नहीं होते हैं - और यह वह जगह है जहां आपकी समस्या निहित है।

एक वर्कअराउंड (आदर्श से बहुत दूर अगर आपके पास कई दृश्य फाइलें हैं) हर एक को निर्दिष्ट करना होगा text! निर्भरता जिसका आप उपयोग करते हैं include विकल्प अपने बिल्ड कॉन्फ़िगरेशन के अंदर, उदा .:

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

उत्तर № 2 के लिए 1

आप weyland देना चाह सकते हैं, Durandal का एक प्रयास है। एक उदाहरण weyland-config.js कॉन्फ़िगरेशन 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"
}
});
}