बंडल

Question

का उपयोग करते समय RequJS मॉड्यूल लोड टाइमआउट बंडलों के बिना ठीक काम करने की आवश्यकता है। लेकिन जब भी मैं एक बंडल का उपयोग करता हूं, मुझे उन मॉड्यूल के लिए टाइमआउट मिलता है जिन्हें मैं आयात करने की कोशिश कर रहा हूं।

यहाँ है मैं कैसे/asp.net MVC के बंडलर साथ बंडलों minifier

bundles.Add(new ScriptBundle("~/bundles/test").Include(
      "~/scripts/jquery-{version}.js", 
      "~/scripts/bootstrap.js", 
      "~/scripts/moment.js")); 

bundles.EnableOptimizations = true; 

यहाँ है निर्माण की आवश्यकता होती है cshtml फ़ाइल में js config:

<script> 
    require.config({ 
     baseUrl: "/scripts", 
     paths: { 
      jquery: "jquery-1.11.2" 
     }, 
     waitSeconds: 20, 
     shim: { 
      bootstrap: { 
       deps: ['jquery'] 
      } 
     }, 
     bundles: { 
      '@Scripts.Url("~/bundles/test").ToString()': [ 
       'jquery', 
       'bootstrap', 
       'moment' 
      ] 
     } 
    }); 
    require(["app/main/test"]); 
</script> 

और के लिए js पेज (एप्लिकेशन/मुख्य/परीक्षण):

require(['jquery', 'moment'], function ($, moment) { 
    console.log(moment().format()); 
}); 

jQuery, बूटस्ट्रैप और पल पुस्तकालयों परीक्षण बंडल में हैं मैं रचनात्मक है एटीड, लेकिन मुझे पल के लिए पेज लोड करने में लोड टाइमआउट मिलते हैं।

कोई भी विचार:

यहाँ क्रोम निरीक्षक त्रुटि है?

अग्रिम धन्यवाद।

Answer 1

ऐसा इसलिए हो रहा है क्योंकि आपको अपने बंडल की आवश्यकता नहीं है। आपकी आवश्यकता कॉल में केवल jquery और पल है। आपने jquery फ़ाइल पथ प्रदान किया है, इसलिए requjs jquery मॉड्यूल को डाउनलोड करने और प्रदान करने के लिए उस पथ का उपयोग करता है। लेकिन चूंकि पल के लिए कोई पथ परिभाषा नहीं है, इसलिए यह आपके द्वारा बनाए गए बंडल का केवल एक हिस्सा है। तो requjs अपने मॉड्यूल नाम से पथ के रूप में पल डाउनलोड करने की कोशिश करता है और इस प्रकार एक त्रुटि फेंकता है।

इसके लिए एक साधारण फिक्स को बंडल की आवश्यकता होती है।

require(['@Scripts.Url("~/bundles/test").ToString()'], function(bundle){ 
    //At this point jquery, moment and bootstrap will be loaded. 
}); 

आप चुन सकते हैं jQuery, ऊपर के उदाहरण में ग्लोबल नेम स्पेस से पल सीधे उपयोग करने के लिए या आप उन्हें उदाहरण नीचे अलग से में की आवश्यकता होती है की कोशिश कर सकते हैं। मुझे यकीन नहीं है, लेकिन चक्रीय निर्भरता के कारण आप नीचे उदाहरण के साथ त्रुटि में हो सकते हैं।

require(['@Scripts.Url("~/bundles/test").ToString()', 'jquery', 'moment'], function(bundle, $, moment){ 
     //At this point jquery, moment and bootstrap will be loaded. 
    }); 

Answer 2

बस अपने बंडलों

bundles.Add(new ScriptBundle("~/bundles/test").Include(
     "~/scripts/bootstrap.js", 
     "~/scripts/moment.js")); 

... 
bundles: { 
    '@Scripts.Url("~/bundles/test").ToString()': [ 
     'bootstrap', 
     'moment' 
    ] 
} 
... 

आप पहले से ही यह पथ में निर्दिष्ट किया है से 'jquery' हटाने

paths: { 
    jquery: "jquery-1.11.2" 
}, 

---

यह प्रतीत s requ.js मॉड्यूल को बंडलों के लिए मानचित्र करता है ताकि एक बार एक बंडल का हिस्सा जो मॉड्यूल लोड हो जाए, वह बंडल फिर से लोड नहीं होता है।