क्रोम देव उपकरण - जावास्क्रिप्ट को संशोधित करें और पुनः लोड करें

Question

क्या किसी पृष्ठ के जावास्क्रिप्ट को संशोधित करना और फिर संशोधित जावास्क्रिप्ट फ़ाइल को पुनः लोड किए बिना पृष्ठ को फिर से लोड करना संभव है (और इस प्रकार संशोधनों को खोना)?

Answer 1

यह चारों ओर एक सा काम है, लेकिन आप इसे प्राप्त कर सकते हैं एक तरीका जावास्क्रिप्ट फ़ाइल की शुरुआत में एक ब्रेकपॉइंट जोड़कर या आप हेरफेर करना चाहते हैं ब्लॉक करें।

फिर जब आप पुनः लोड करते हैं, तो डिबगर उस ब्रेकपॉइंट पर विराम देगा, और आप स्रोत में इच्छित परिवर्तन कर सकते हैं, फ़ाइल को सहेज सकते हैं और फिर डीबगर को संशोधित कोड के माध्यम से चला सकते हैं।

लेकिन जैसा कि सभी ने कहा है, अगले पुनः लोड में परिवर्तन हो जाएगा - कम से कम यह आप कुछ थोड़ा संशोधित जेएस क्लाइंट पक्ष चलाते हैं।

Comments

पता चला कि यह वह उत्तर था जिसकी मुझे तलाश थी। जावास्क्रिप्ट कोड की पहली पंक्ति पर एक विराम बिंदु रखें। फिर जब ब्रेक होता है, तो अपने संशोधित कोड को वहां पेस्ट करें। Unpause और यह काम करता है!

— निकोलस ब्लास्जेन

आप वहां कोड कैसे संपादित या पेस्ट कर सकते हैं? मैं निश्चित रूप से क्रोम कंसोल में उस कार्यक्षमता को नहीं देखता हूं। मैं जेएस / एचटीएमएल को एलिमेंट्स सेक्शन से एडिट कर सकता हूं, लेकिन यह अपने आप लोड नहीं होता। लेकिन जिस जगह पर ब्रेकपॉइंट सेट किए गए हैं, वह आसानी से दिखाई देता है

— जोश सटरफील्ड

दुर्भाग्य से यह अभी भी एक महान समाधान नहीं है। आपके द्वारा जोड़ा गया कोई भी कोड कंसोल में उपलब्ध नहीं है। उदाहरण के लिए var foo = 'bar'स्क्रिप्ट में जोड़ने fooसे कंसोल का पर्दाफाश नहीं होता है।

— AgmLauncher

बाहरी स्क्रिप्ट के साथ क्या हो रहा है? ब्रेकप्वाइंट उनसे गायब होने लगते हैं।

— ओलेहजिनेक

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

— मारेक

Answer 2

बड़ी खबर है, मार्च 2018 में फिक्स आ रहा है, इस लिंक को देखें: https://developers.google.com/web/updates/2018/01/devtools

"स्थानीय ओवरराइड्स आपको DevTools में परिवर्तन करने देते हैं, और उन परिवर्तनों को पृष्ठ भार में रखते हैं। इससे पहले, जब आप पृष्ठ को पुनः लोड करते हैं तो DevTools में आपके द्वारा किए गए किसी भी परिवर्तन को खो दिया जाएगा। स्थानीय ओवरराइड अधिकांश फ़ाइल प्रकारों के लिए कार्य करते हैं।

यह काम किस प्रकार करता है:

• आप एक निर्देशिका निर्दिष्ट करते हैं जहाँ DevTools परिवर्तनों को सहेजना चाहिए। जब आप DevTools में परिवर्तन करते हैं, तो DevTools आपकी निर्देशिका में संशोधित फ़ाइल की एक प्रति सहेजता है।
• जब आप पृष्ठ को पुनः लोड करते हैं, तो नेटवर्क संसाधन के बजाय, DevTools स्थानीय, संशोधित फ़ाइल परोसता है।

स्थानीय ओवरराइड्स की स्थापना के लिए:

1. स्रोत पैनल खोलें।
2. ओवरराइड्स टैब खोलें।
3. सेटअप ओवरराइड पर क्लिक करें।
4. चुनें कि आप किस निर्देशिका को अपने परिवर्तनों को सहेजना चाहते हैं।
5. अपने व्यूपोर्ट के शीर्ष पर, DevTools को निर्देशिका में पढ़ने और लिखने की अनुमति देने के लिए अनुमति दें पर क्लिक करें।
6. अपने बदलाव करें। ”

अद्यतन (19 मार्च, 2018): यह लाइव है, यहाँ विस्तृत विवरण: https://developers.google.com/web/updates/2018/01/devtools#overrides

Comments

Chrome 65 की रिलीज़ के साथ, यह नया स्वीकृत उत्तर होना चाहिए। (क्रोम कैनरी में कार्यशीलता पहले से ही उपलब्ध थी)

— माइक्रो

मेरे पास एक फाइल है "a.js? Ver = 1.2"। इसे ओवरराइड फ़ोल्डर में "a.js" के रूप में सहेजा जाता है, और ओवरराइड के रूप में लोड नहीं किया जाता है। जब पैरामीटर होते हैं तो क्या यह काम नहीं करता है? क्या आसपास कोई काम है?

— राल्फ

इरादा के अनुसार काम करता है, लेकिन एक बात का ध्यान रखने की जरूरत है। एक बार जब आप अपने मूल js को लोड करना चाहते हैं तो आप ओवरराइड कॉन्फ़िगरेशन को साफ़ कर सकते हैं या स्थानीय रूप से संशोधित फ़ाइल (उस फ़ोल्डर में सहेजे गए जिसे आप ओवरराइड करते समय निर्दिष्ट करते हैं) को हटा सकते हैं।

— मुहम्मद मुराद हैदर

Answer 3

संसाधन अवहेलना विस्तार आप वास्तव में ऐसा करने की अनुमति देता है:

• उस url के लिए एक फ़ाइल नियम बनाएँ जिसे आप बदलना चाहते हैं
• एक्सटेंशन में js / css / etc को एडिट करें
• जितनी बार आप चाहते हैं उतनी बार लोड करें :)

Comments

क्या मेरे साथ छल करने के लिए धन्यवाद। मैं उस एक्सटेंशन से पहले विंडोज के लिए फिडलर का उपयोग करता था। अभी मैं किसी भी प्लेटफ़ॉर्म पर दूरस्थ फ़ाइलों को डीबग कर सकता हूं।

— अहमद अल्फी

मैं सॉफ्टवेयर को नहीं समझता, क्या कोई समझा सकता है कि मुझे इसे कैसे स्थापित करना है?

— काला

Answer 4

मुझे पता है कि यह सटीक प्रश्न (Chrome डेवलपर टूल) के लिए asnwer नहीं है, लेकिन मैं सफलता के साथ इस समाधान का उपयोग कर रहा हूं: http://www.telerik.com/fiddler

(इस उपकरण के बारे में कुछ वेब देवों को पहले से ही पता है)

1. फ़ाइल को स्थानीय रूप से सहेजें
2. आवश्यकतानुसार संपादित करें
3. फायदा!

पूर्ण डॉक्स: http://docs.telerik.com/fiddler/KnowledgeBase/AutoResponder

पुनश्च। मैं इसके बजाय इसे क्रोम में एक ध्वज के रूप में लागू preserve after reloadकरना चाहता था, अब यह नहीं कर सकता, मंचों और चर्चा समूहों को कॉर्पोरेट नेटवर्क पर अवरुद्ध किया गया :)

Answer 5

हां, बस देव-टूल्स में "सोर्स" टैब खोलें और उस स्क्रिप्ट पर नेविगेट करें जिसे आप बदलना चाहते हैं। सीधे देव टूल्स विंडो में अपना समायोजन करें और फिर स्क्रिप्ट को बचाने के लिए ctrl + s को हिट करें - पता है कि नए js का उपयोग तब तक किया जाएगा जब तक आप पूरे पृष्ठ को ताज़ा नहीं करते।

Comments

क्रोम का क्या संस्करण? हां, आप किसी स्क्रिप्ट की सामग्री को "संपादित कर सकते हैं" (हालांकि पृष्ठ पर स्वयं स्क्रिप्ट नहीं), लेकिन परिवर्तनों का कोई प्रभाव नहीं पड़ता है, और ctrl-s / save जैसा कि आप स्थानीय रूप से स्क्रिप्ट को सहेजते हैं (जैसे ctrl-as) मुख्य खिड़की)।

— दविदकोनराड

मैं संस्करण 34 का उपयोग करता हूं - जब मैं एक स्क्रिप्ट संपादित करता हूं जैसे कि एक क्लिक इवेंट (पहले से ही बॉन्ड) में एक कंसोल.लॉग जोड़ें और सहेजें, कंसोल संदेश के बाद आउटपुट करता है: "पुनरावर्तन और अद्यतन सफल रहा।" - उसके बाद। जब मैं क्लिक इवेंट को ट्रिगर करता हूं तो मुझे कंसोल में लॉग-आउटपुट मिलता है।

— जैकबॉक्स

जब आप पृष्ठ को फिर से लोड करते हैं तो यह स्थानीय रूप से संशोधित फ़ाइल का उपयोग नहीं करता है।

— जेक विल्सन

आपने मुझे "हाँ" पर लिया था ... लेकिन तब आपने मुझे "तब तक खो दिया जब तक आप पूरे पृष्ठ को ताज़ा नहीं करते" ....

— कूल ब्लू