Webpack निहित विक्रेता/IE11 में प्रकट हिस्सा - वादा अपरिभाषित

Question

लघु संस्करण है

जब मैं IE11 में अपने आवेदन चलाने के लिए, मैं manifest.js फ़ाइल के भीतर से एक त्रुटि कह Promise is undefined मिलता है।

मैं babel-polyfill कैसे जोड़ूं या ऐसा से पहले मैनिफेस्ट निष्पादित किया गया है?

लांग संस्करण

मैं आदेश एक अलग बंडल में तीसरे पक्ष (NPM पैकेज) लिपियों विभाजित करने के लिए मेरी webpack config को CommonsChunkPlugin जोड़ने की कोशिश कर रहा हूँ। वेबपैक 2 प्रलेखन के अनुसार मैंने "combined implicit common vendor chunks and manifest file" स्थापित किया है जो आधुनिक ब्राउज़र में अच्छी तरह से काम कर रहा है।

मैंने यह सुनिश्चित करने के लिए एक फ़ंक्शन लिखा है कि भाग को मेरी अनुक्रमणिका फ़ाइल में सही क्रम में शामिल किया गया है (नीचे देखें)।

मेरे दो स्पष्ट प्रवेश बिंदुओं पर के बारे में थोड़ी:

• legacy_libs - पुराना पुस्तकालयों कि script-loader साथ ग्लोबल नेम स्पेस में रखा जाता है। मेरा मुख्य अनुप्रयोग प्रवेश बिंदु

अन्य दो (विक्रेता और प्रकट) अंतर्निहित और CommonsChunkPlugin के साथ बनाई गई हैं - मैं समय

मुख्य पर इन चरणबद्ध की उम्मीद है।

जब मैं इसे IE11 के साथ चलाता हूं, तो मुझे एक त्रुटि मिलती है: Promise is undefined। ऐसा प्रतीत होता है क्योंकि वेबपैक प्रकट स्वयं new Promise() पर कॉल कर रहा है।

मेरे मुख्य प्रवेश बिंदु में मेरे पास import 'babel-polyfill'; है। इससे पहले कि मैंने विक्रेता & मैनिफेस्ट चंकिंग जोड़ा, इससे पहले मुझे आईई की वादे की कमी को दूर करने की अनुमति मिली। लेकिन अब जब मैंने पहले लोड किया है manifest.js लोड हो रहा है, तो मैं इसे सही क्रम में शामिल करने का तरीका नहीं समझ सकता।

मेरे config तो दिखाई देता है:

module.exports = { 
    entry: { 
    legacy_libs: './app/libs.js', 
    main: './app/main.js' 
    }, 
    ... 
    plugins: [ 
    // Extract third party libraries into a separate vendor bundle. 
    // Also extract webpack manifest into its own bundle (to prevent vendor hash changing when app source changes) 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: 'vendor', 
     minChunks: function (module) { 
     return module.context && module.context.indexOf('node_modules') !== -1; 
     } 
    }), 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: 'manifest' 
    }), 

    // Generate index.html file. 
    // Include script bundles in the right order based on chunk name prefixes. 
    new HtmlWebpackPlugin({ 
     template: 'app/index.ejs', 
     chunksSortMode: function (a, b) { 
     const chunkOrder = ['manifest', 'vendor', 'legacy_libs', 'main']; 
     const aChunk = chunkOrder.findIndex(chunk => a.names[0].startsWith(chunk)); 
     const bChunk = chunkOrder.findIndex(chunk => b.names[0].startsWith(chunk)); 
     const aValue = (aChunk > -1) ? aChunk : chunkOrder.length; 
     const bValue = (bChunk > -1) ? bChunk : chunkOrder.length; 
     return aValue - bValue; 
     } 
    }) 
} 

Answer 1

यह एक मुद्दा webpack 2.6.0 के साथ पेश हो रहा है, एक बग पहले से ही जारी किया जाता है: https://github.com/webpack/webpack/issues/4916

तो या तो बगफिक्स जारी होने तक प्रतीक्षा करें या वापस 2.5.1 पर वापस आएं!

Answer 2

मैं एक ही मुद्दे में भाग गया। मेरी कॉन्फ़िगरेशन आपके समान है (विक्रेता & मैनिफेस्ट)। जिस तरह से मैंने इसे हल किया था, वह मेरे मैनिफेस्ट के प्रवेश बिंदु में babel-polyfill जोड़ना था। आपका entry इस तरह दिखना चाहिए:

entry: { 
    legacy_libs: './app/libs.js', 
    main: './app/main.js', 
    manifest: 'babel-polyfill' 
} 

यह polyfill लोड होगा तो यह मैनिफ़ेस्ट फ़ाइल में इस्तेमाल किया जा सकता।

संपादित करें: जब निर्माण यह एक और त्रुटि (हालांकि यह देव-सर्वर पर ठीक चलाता है) का उपयोग करना:

ERROR in CommonsChunkPlugin: While running in normal mode it's not allowed to use a non-entry chunk (manifest)

प्रवेश द्वारों और CommonsChunkPlugin संशोधित तो यह इस तरह दिखता है द्वारा यह निश्चित:

entry: { 
    legacy_libs: './app/libs.js', 
    main: './app/main.js', 
    'babel-polyfill': 'babel-polyfill' 
}, 
... 
plugins: [ 
    ... 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: 'manifest', 
     chunks: 'babel-polyfill' 
    }), 
]