वेबपैक खंड लोडिंग प्रगति

Question

मुझे वेबपैक भाग सर्वर से लोड होने पर प्रगति पट्टी प्रदर्शित करने की आवश्यकता है। क्या यह हासिल करने के लिए कोई आसान समाधान है? मैं उम्मीद करता हूं कि इसके लिए कुछ प्लगइन पहले से मौजूद है, लेकिन Google पर एक त्वरित खोज ने कोई भी खुलासा नहीं किया।

धन्यवाद

Answer 1

--UPDATE-- मेरे लिए क्षमा याचना मैं गलत समझा था सवाल फिर भी मैं बस यहाँ इस जवाब रहेंगे, क्योंकि यह एक तरह से यह करने के लिए संबंधित है।

---

मेरा मानना ​​है कि के लिए है कि आप क्या देख रहे हैं: "प्रगति-बार-webpack-प्लगइन" सिर्फ एक NPM इस पर स्थापित है:

NPM स्थापित प्रगति-बार-webpack-

plugins: [ 
    new ProgressBarPlugin() 
] 

: प्लगइन डी

फिर तो जैसे अपने webpack प्लगइन विन्यास में शामिल https://www.npmjs.com/package/progress-bar-webpack-plugin

---

भी आप के लिए यह करने के लिए एक और प्लगइन नहीं है:

वहाँ और अधिक विकल्प है कि आप इस प्लगइन के रूप में अच्छी तरह से जोड़ सकते हैं, जो आप यहाँ देख सकते हैं। इसे प्रोग्रेसप्लगिन कहा जाता है सिवाय इसके कि यह प्रत्येक मॉड्यूल की एक सूची तैयार करेगा और प्रगति पट्टी के बजाय प्रतिशत बनाएगा।

new webpack.ProgressPlugin(function handler(percentage, msg) { 
    var p = Math.floor(percentage * 100); 
    if (config.percent !== p) { 
    config.percent = p; 
    console.log(msg, config.percent + '%'); 
    } 
}), 

बस अपने webpack प्लगइन्स को यह जोड़ने और इसे टर्मिनल में बनाया मॉड्यूल के लिए प्रगति दिखाएगा:

यहाँ एक उदाहरण कार्यान्वयन है।

कोई भी अच्छी तरह से काम करता है, मैं अधिमानतः बस प्रगति पट्टी की तरह हूं क्योंकि मैं अपने टर्मिनल में एक बड़ी सूची नहीं देखना चाहता हूं। आपकी पंसद! :)

Answer 2

require.ensure एक वादा देता है। इसके साथ आप इंगित कर सकते हैं कि एक खंड लोड हो गया है या नहीं:

//entry.js 
console.log('loading my chunk...); 
let chunkPromise = require.ensure([],() => { 
    require('./my-module'); 
}); 

chunkPromise 
    .then(() => console.log('chunk loaded')) 
    .catch(e => console.error('chunk failed to load'));