ब्रेकिंग चेंज: बैबल 6 एक्सपोर्ट डिफॉल्ट बिहेवियर

बेबल 6 की रिलीज के साथ, डिफॉल्ट एक्सपोर्ट को कैसे प्रबंधित किया जाता है, इसमें महत्वपूर्ण बदलाव लागू किए गए हैं . जबकि बेबेल ने पहले मॉड्यूल.एक्सपोर्ट्स = एक्सपोर्ट्स["डिफॉल्ट"] लाइन जोड़ी थी, इस कार्यक्षमता को हटा दिया गया है।

इस संशोधन के लिए मॉड्यूल आयात सिंटैक्स में बदलाव की आवश्यकता है। पहले, लीगेसी सिंटैक्स का उपयोग करने वाला कोड:

var foo = require('./foo');
// use foo

अब निम्नलिखित सिंटैक्स का उपयोग करना चाहिए:

var foo = require('./foo').default;
// use foo

हालांकि यह समायोजन मामूली लग सकता है, यह पिछले निर्यात तंत्र पर महत्वपूर्ण कोड निर्भरता वाली परियोजनाओं के लिए एक चुनौती पैदा कर सकता है।

समाधान

यदि विरासत निर्यात व्यवहार की आवश्यकता है, तो CommonJS के प्रत्यक्ष उपयोग की अनुशंसा की जाती है। वैकल्पिक रूप से, वांछित अनुकूलता प्रदान करने के लिए एक कस्टम प्लगइन का उपयोग किया जा सकता है। इस प्लगइन की कार्यक्षमता संभवतः बैबल 6 में हटाए गए व्यवहार को प्रतिबिंबित करेगी, ट्रांसपिल्ड आउटपुट में मॉड्यूल.एक्सपोर्ट्स = एक्सपोर्ट्स["डिफॉल्ट"] लाइन को जोड़ेगी।

नामित एक्सपोर्ट्स का प्रभाव

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

// इनपुट स्थिरांक फू = {} निर्यात डिफ़ॉल्ट foo

Babel 5 आउटपुट

// Input
const foo = {}
export default foo

बेबल 6 आउटपुट

// Input
const foo = {}
export default foo

जैसा कि देखा जा सकता है, आउटपुट में एकमात्र अंतर बेबेल 6 में मॉड्यूल.एक्सपोर्ट = निर्यात["डिफ़ॉल्ट"] की अनुपस्थिति है।