string - ईएस 6 स्ट्रिंग लिटलल्स/टाइपस्क्रिप्ट के साथ क्रोम देव टूल्स इश्यू




google-chrome debugging (2)

मैं टाइपस्क्रिप्ट का उपयोग कर एक प्रोजेक्ट पर काम कर रहा हूं और ईएस 6 स्ट्रिंग लिटल जैसे टाइपस्क्रिप्ट द्वारा उजागर की गई कुछ ईएस 6 विशेषताएं जैसे `Something ${variable} Something else`

एक समस्या को डीबग करने के दौरान मैंने स्रोत पैनल में इसके माध्यम से कदम उठाने के लिए अपनी टाइपस्क्रिप्ट फ़ाइल में ब्रेकपॉइंट गिरा दिया, जो आमतौर पर ठीक काम करता है।

लेकिन क्रोम देव टूल्स में ES6 स्ट्रिंग अक्षर के साथ कोई समस्या है और ऐसा लगता है कि ईएस 6 स्ट्रिंग अक्षर का अंत नहीं है।

इसके बजाय स्ट्रिंग शाब्दिक के बाद सभी कोड लाल चिह्नित हैं (डीबगर में स्ट्रिंग हाइलाइटिंग) और चरम निरीक्षण से अवरुद्ध है क्योंकि क्रोम डीबगर को लगता है कि यह एक बड़ी स्ट्रिंग है।

क्या किसी ने इस समस्या का सामना किया है, एक फिक्स पाया है या जानता है कि यह क्रोम देव उपकरण के लिए Google के रोडमैप पर है या नहीं?

संपादित करें 1:
ऐसा लगता है कि इस समस्या को वर्तमान में क्रोमियम टीम द्वारा काम किया जा रहा है। अपडेट के लिए समस्या रिपोर्ट देखें:
bugs.chromium.org/p/chromium/issues/detail?id=659515

संपादित करें 2: कुछ समय के लिए बग खुला है, लेकिन ऐसा प्राथमिकता प्रतीत नहीं होता है। यदि आप समस्या का अनुभव करते हैं तो उपरोक्त क्रोमियम लिंक पर जाएं और इसे सहायक उपकरण के साथ देव उपकरण टीम के फोकस में स्थानांतरित करने के लिए स्टार / टिप्पणी करें।


डेवटूल टीम से 14 दिसंबर, 2017 की टिप्पणी में कहा गया है कि उन्होंने देवटूल में इस्तेमाल किए गए कोडमिरर संस्करण को अपडेट किया है, और इस मुद्दे को अभी तय किया जाना चाहिए। क्रोम 64 में और उससे परे काम करना चाहिए। क्रोम के पुराने संस्करणों में यह अभी भी टूटा जाएगा। आप chrome://version पर अपना संस्करण देख सकते हैं।


यदि आप टाइपस्क्रिप्ट का उपयोग कर रहे हैं, तो आप अपने कोड को ES2015 पर संकलित करके और स्रोत मानचित्रों का उपयोग करके इस समस्या के आसपास काम कर सकते हैं। इस तरह, बैकटिक इंटरपोलेटेड स्ट्रिंग को अच्छी ओएल ' "string " + variable + " string" परिवर्तित कर दिया जाएगा, लेकिन बैकटिक्स के साथ मूल टाइपस्क्रिप्ट कोड को देखते हुए भी आप डीबग कर पाएंगे।

इसे आपके tsconfig.json में निम्नलिखित जोड़ने की आवश्यकता होगी:

{
    "compilerOptions": {
        "target": "ES2015",
        "sourceMap": true, 
        ...
    }
    ...
}

और यदि आप जेनरेट की गई .js फ़ाइलों के साथ स्थानीय रूप से जेनरेट की गई स्रोत मानचित्र फ़ाइलों ( .js.map ) की सेवा करते हैं, तो आप Ctrl-p साथ "स्रोत" के अंतर्गत क्रोम देव उपकरण में टाइपस्क्रिप्ट फ़ाइलों को खोलने में सक्षम होना चाहिए।





google-chrome-devtools