2015-08-21 6 views
48

मैं एक ES6 वेब webpack साथ कोलाहल द्वारा संकलित अनुप्रयोग में Object.assign() उपयोग करने का प्रयास कर रहा हूँ, लेकिन मैं एक त्रुटि हो रही है:ऑब्जेक्ट.साइन() को पॉलीफिल की आवश्यकता क्यों होती है जब बेबेल-लोडर का उपयोग किया जा रहा है?

Uncaught TypeError: Object.assign is not a function 

मैं पहले से ही babel-loader उपयोग कर रहा हूँ ES5 को ES6 transpile है, इसलिए मेरे सभी अन्य ES6 कोड काम कर रहा है। फिर भी, Object.assign() मेरे कोडबेस में import "babel-core/polyfill" के बाद ही काम करता है। मुझे लगता है कि मैं यह by importing babel-runtime भी ठीक कर सकता हूं, लेकिन मुझे क्यों समझना हैObject.assign()babel-loader प्रदर्शन से अधिक की आवश्यकता है - babel-loaderObject.assign() सहित प्रीप्रोसेस सब कुछ नहीं चाहिए?

+10

बस एक नोट का उपयोग कर: polyfill, बुलाया "कोलाहल कोर/polyfill "उस समय वें इस सवाल पर लिखा गया था, अब "babel-polyfill" है, प्रति [दस्तावेज़] (https://babeljs.io/docs/usage/polyfill/)। –

उत्तर

45

babel-loader के माध्यम से बेबेल, ES6 वाक्यविन्यास में पारदर्शी अंतर। अपने आप पर बेबेल ES6 मानक लाइब्रेरी कार्यक्षमता (जैसे Object.assign) में जोड़ने के लिए बिल्कुल कुछ नहीं करता है। पॉलीफिल लोड करना आपके लिए एक अलग पॉलीफिल core-js लोड करता है, लेकिन आप जो भी पॉलीफिल चाहते हैं उसे लोड कर सकते हैं।

यहां तक ​​कि कुछ वाक्यविन्यास रूपांतरण विशिष्ट पॉलीफिल कार्यक्षमता पर भरोसा करते हैं, क्योंकि कुछ वाक्यविन्यास लाइब्रेरी कोड में लागू एल्गोरिदम और व्यवहार पर निर्भर करता है। http://babeljs.io/docs/learn-es2015/ पर ईएस 6 विशेषताएं प्रत्येक सूची में मानक पुस्तकालय कार्यक्षमता को लोड किया गया माना जाता है।

+0

ग्रेट स्पष्टीकरण! धन्यवाद! –

9

Object.assign() एक नई एपीआई है जो ES6 spec का हिस्सा है, इसलिए इसे अभी तक अधिकांश ब्राउज़रों में लागू नहीं किया गया है। देखें: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

तो जब आप babel-core/polyfill आयात करते हैं, तो इसमें पॉलीफिल और अन्य नए एपीआई आयात होते हैं, ताकि आपका ES6 कोड उनका उपयोग कर सके।

babel-loader केवल ट्रांस्फरर है जो ईएस 6 सिंटैक्स को ES5 संगत कोड में परिवर्तित करता है।

3

यदि आप संगतता पर जाते हैं तो आप आईई 11 ऑब्जेक्ट.साइन के लिए वेब और मोबाइल दोनों में समर्थित नहीं हैं। यह आपको इसके लिए pollyfill भी देता है।

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

if (typeof Object.assign != 'function') { 
    Object.assign = function(target, varArgs) { 
'use strict'; 
if (target == null) { // TypeError if undefined or null 
    throw new TypeError('Cannot convert undefined or null to object'); 
} 

var to = Object(target); 

for (var index = 1; index < arguments.length; index++) { 
    var nextSource = arguments[index]; 

    if (nextSource != null) { // Skip over if undefined or null 
    for (var nextKey in nextSource) { 
     // Avoid bugs when hasOwnProperty is shadowed 
     if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) { 
     to[nextKey] = nextSource[nextKey]; 
     } 
     } 
    } 
    } 
    return to; 
    }; 
} 

तो कोलाहल

https://babeljs.io/docs/plugins/transform-object-assign/

का उपयोग कर भविष्य पाठकों के लिए NPM

https://www.npmjs.com/package/object-assign

संबंधित मुद्दे