ऑब्फ़स्केटेड फ़ाइलों के बीच आइडेंटिफ़ायर टकराव से बचना
जब कई VM-ऑब्फ़स्केटेड फ़ाइलें एक ही बंडल में पहुँच जाती हैं, तो वे एक ही टॉप-लेवल आइडेंटिफ़ायर घोषित कर सकती हैं और पार्स के समय पेज क्रैश हो जाता है। यहाँ बताया गया है कि ऐसा क्यों होता है और इसे कैसे ठीक करें।
लक्षण
आपका बिल्ड ठीक चलता है, लेकिन ऐप शुरू होने से पहले ही, पार्स के समय ब्राउज़र एरर फेंक देता है:
बंडल में एक त्वरित जाँच से पुष्टि हो जाती है कि एक ही आइडेंटिफ़ायर एक से ज़्यादा चंक में घोषित है:
ऐसा क्यों होता है
डिफ़ॉल्ट रूप से VM ऑब्फ़स्केशन mangled-shuffled आइडेंटिफ़ायर-नाम जनरेटर का उपयोग करता है। यह एक छोटे वर्णमाला-समूह को
निर्धारित शफ़ल्ड क्रम में चलाता है, और रनटाइम द्वारा जोड़े गए ग्लोबल्स में vm प्रीफ़िक्स लगाता है। दोनों फ़ाइलें उसी शफ़ल्ड
अनुक्रम से आइडेंटिफ़ायर निकालती हैं — यानी हर फ़ाइल का पहला ग्लोबल एक ही नाम पाता है, दूसरा एक और, और इसी तरह आगे।
हर फ़ाइल स्वतंत्र रूप से ऑब्फ़स्केट होती है और हर बार जनरेटर अपने अनुक्रम की शुरुआत से फिर चालू हो जाता है। जब दो फ़ाइलें एक ही
बंडल में पहुँचती हैं, तो नाम टकरा जाते हैं। दो टॉप-लेवल const vmd = … घोषणाएँ एक ही स्कोप में आ जाती हैं और पार्सर दूसरी
वाली को अस्वीकार कर देता है।
समाधान
इनमें से कोई एक चुनें — पहला विकल्प अनुशंसित समाधान है:
randomIdentifiersPrefixचालू करें (अनुशंसित)हर ऑब्फ़स्केशन रन को एक अनोखा रैंडम प्रीफ़िक्स मिलता है, जो हर जनरेट किए गए आइडेंटिफ़ायर के आगे लग जाता है। अलग-अलग फ़ाइलों के नाम अब एक नेमस्पेस साझा नहीं करते, इसलिए बिना हाथ से प्रीफ़िक्स तय किए ही टकराव ख़त्म हो जाते हैं।
हर फ़ाइल के लिए अलग
identifiersPrefixसेट करेंहर फ़ाइल ऑब्फ़स्केट करते समय अलग प्रीफ़िक्स मैन्युअली दें (जैसे एक के लिए
identifiersPrefix: 'auth_', दूसरे के लिएcheckout_)। यह कारगर है, लेकिन बहुत सारी फ़ाइलें होने पर ग़लती की संभावना रहती है — ऊपर वाला रैंडम विकल्प बेहतर है।identifierNamesGeneratorकोhexadecimalपर बदलेंहेक्साडेसिमल नाम कहीं बड़े कीस्पेस का उपयोग करते हैं, इसलिए दो फ़ाइलों के एक ही आइडेंटिफ़ायर बनाने की संभावना नगण्य हो जाती है। ट्रेड-ऑफ़: ये आइडेंटिफ़ायर
mangled-shuffledके आउटपुट से लंबे होते हैं, इसलिए बंडल थोड़ा बड़ा हो जाता है।किसी बंडलर प्लगइन या मल्टी-फ़ाइल बैच UI का उपयोग करें
अधिकांश आधिकारिक बंडलर प्लगइन्स (webpack, Rollup, Vite) एक ही बिल्ड की सभी फ़ाइलों में प्रीफ़िक्स की अनोखापन अपने आप संभाल लेते हैं। मल्टी-फ़ाइल बैच ऑब्फ़स्केशन इस्तेमाल करने पर obfuscator.io UI भी यह संभाल लेता है। अगर आप npm API से ऑब्फ़स्केशन ख़ुद जोड़ रहे हैं, तो रैंडम प्रीफ़िक्स आपको स्वयं चालू करना होगा।
संबंधित विकल्प
randomIdentifiersPrefix— प्रति बिल्ड रैंडम प्रीफ़िक्स (अनुशंसित)identifiersPrefix— स्पष्ट प्रीफ़िक्स स्ट्रिंगidentifierNamesGenerator— नाम का स्वरूप (mangled,hexadecimal, …)
