Chrome में एक पंक्ति द्वारा स्रोत बंद, रूबी ऑन रेल्स, वेबपैक और रिएक्ट JS

Question

inline-source-mapजब मैं Chrome devtools डिबगर का उपयोग करता हूं , तो कॉन्फ़िगरेशन समस्या का उपयोग करके वेबपैक द्वारा उत्पन्न किए गए स्रोत, जहां मैं एक पंक्ति से बंद हूं, एक समस्या है । वेबपैक एक रूबी के अंदर एक दर्जन से अधिक मॉड्यूल से बना एक अचूक, अचयनित जावास्क्रिप्ट फ़ाइल बनाने के लिए रेल्स एप्लीकेशन पर स्थापित किया गया है। उन मॉड्यूलों में से अधिकांश ReactJS घटक हैं, और jsxलोडर द्वारा पार्स किए जाते हैं । Webpack से आउटपुट तब application.jsकुछ अन्य जावास्क्रिप्ट पुस्तकालयों में रत्न के साथ फाइल में शामिल किया गया है ।

जब मैं उपयोग करता हूं eval-source-map, तो कोई समस्या नहीं है। inline-source-mapलाइन नंबरों के उपयोग के बारे में कुछ एक के बाद एक फेंक दिया जाता है।

जावास्क्रिप्ट का निरीक्षण करना जो एक रिएक्ट घटक नहीं है, अभी भी यह समस्या है, इसलिए मुझे नहीं लगता कि यह jsx के उपयोग से संबंधित है।

Comments

ऐसा लगता है जैसे एक पक्ष पहली पंक्ति को रेखा 0मानता है और दूसरा इसे रेखा मानता है 1। आपको बस एक परिभाषा चुननी पड़ सकती है, और किसी भी चीज़ के लिए मूल्य समायोजित कर सकते हैं जो दूसरे तरीके से काम करता है।

— कार्ल स्मिथ

यदि सोर्समैप में लाइन नंबरों के लिए ब्राउज़र द्वारा उपयोग किए जाने वाले मूल्य को समायोजित करने का एक तरीका है, जो संभावित रूप से समस्या को हल कर सकता है। इसके बाद से तब से मैंने थोड़ा सा काम किया है, और ऐसा लगता है कि जब Sprockets के बिना रेल का उपयोग करते हुए वेब पैक द्वारा उत्पन्न JS को संसाधित करते हैं, तो समस्या दूर हो जाती है। वेबपैक और sprockets दोनों का उपयोग करते समय लाइन नंबर केवल बंद है।

— परदेसिया

मुझे पता नहीं है। मैं मोज़िला के सोर्स-मैप जेएस लाइब्रेरी के साथ कॉफीस्क्रिप्ट के सोर्समैप का उपयोग कर रहा था। सब कुछ ठीक था सिवाय इसके कि columnनिम्न कोड में आर्ग 1 में बहुत अधिक पारित किया गया है window.onerror = function(message, url, line, column){}:। इसे घटाकर तय किया। नोट: यह क्रोम विशिष्ट है, मैं अन्य ब्राउज़रों के बारे में नहीं जानता।

— कार्ल स्मिथ

यह संबंधित प्रतीत होता है: github.com/plumberjs/plumber-requirejs/commit/… जिसमें यह आवश्यकता के लिए प्रोलिम निर्धारित किया है। जेएस

— जस्टिंगोर्डन

क्या ऐसा हो सकता है कि आप इस प्रक्रिया में कहीं हेडर लाइन जोड़ दें, जैसे कॉपीराइट स्टेटमेंट?

— rogierschouten

Answer 1

क्रोम में एक बग था, नवीनतम संस्करण को आज़माएं, अपने वेबपैक कॉन्फिगर पर भी कोशिश करें कि देवटूल पर विभिन्न सोर्समैप्स का उपयोग करके इन सभी को देखने की कोशिश करें कि क्या कोई इनलाइन स्रोत मैप के लिए काम करता है:

• इनलाइन स्रोत-नक्शा

• सस्ते इनलाइन स्रोत-नक्शा

अन्य विभिन्न विन्यासों के लिए:

• सस्ता स्रोत-नक्शा

• सस्ते मॉड्यूल स्रोत-नक्शा

• सस्ते मॉड्यूल-eval स्रोत-नक्शा

वेबपैक कॉन्फ़िगरेशन पर:

{

...

devtool:'source-map'

...

}