इस लेख में, मैं जावास्क्रिप्ट डेवलपर्स के लिए वीएस कोड एक्सटेंशन की सूची पर ध्यान केंद्रित करूंगा।

दृश्य स्टूडियो कोड (वी.एस. कोड) निस्संदेह आज सबसे लोकप्रिय, हल्का कोड संपादक है। यह अन्य लोकप्रिय कोड संपादकों से बहुत अधिक उधार लेता है, ज्यादातर उदात्त पाठ और परमाणु। हालांकि, इसकी सफलता मुख्य रूप से बेहतर प्रदर्शन और स्थिरता प्रदान करने की क्षमता से आती है। इसके अलावा, यह इंटेलीसेनस जैसी बहुत-जरूरी सुविधाएँ भी प्रदान करता है, जो केवल ग्रहण या दृश्य स्टूडियो 2017 जैसे पूर्ण आकार के आईडीई में उपलब्ध थे।

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

वीएस कोड एक्सटेंशन श्रेणी के द्वारा

इस लेख के लिए, मैं VS कोड एक्सटेंशन पर विशेष रूप से जावास्क्रिप्ट डेवलपर्स को लक्षित करने पर ध्यान केंद्रित करूंगा। वर्तमान में, कई वीएस कोड एक्सटेंशन हैं जो इस मानदंड को फिट करते हैं, जो निश्चित रूप से इसका मतलब है कि मैं उन सभी का उल्लेख नहीं कर पाऊंगा। इसके बजाय, मैं VS कोड एक्सटेंशन पर प्रकाश डालूंगा, जिसने लोकप्रियता हासिल की है और जो जावास्क्रिप्ट डेवलपर्स के लिए अपरिहार्य हैं। सरलता के लिए, मैं उन्हें दस विशिष्ट श्रेणियों में बाँटूँगा।

स्निपेट एक्सटेंशन

जब आप पहली बार वीएस कोड स्थापित करते हैं, तो यह जावास्क्रिप्ट और टाइपस्क्रिप्ट के लिए कई अंतर्निहित स्निपेट्स के साथ आता है। स्निपेट आपको दोहराव कोड को जल्दी से लिखने में मदद करता है। हालाँकि, आप पा सकते हैं कि ये पर्याप्त नहीं हो सकते हैं। आप आसानी से अपना खुद का बना सकते हैं, या आप बस एक एक्सटेंशन स्थापित कर सकते हैं जिसमें नए उपयोगी स्निपेट का एक गुच्छा शामिल है। यदि आप सुझाव के शीर्ष पर स्निपेट दिखाना चाहते हैं तो एक त्वरित टिप इस विन्यास का उपयोग करना है:

{ "editor.snippetSuggestions": "top"
}

यहां जावास्क्रिप्ट डेवलपर्स के लिए सबसे लोकप्रिय स्निपेट एक्सटेंशन में से कुछ हैं। हालाँकि, मैं आपको सरलता के लिए सिर्फ एक स्थापित करने की सलाह दूंगा।

• जावास्क्रिप्ट (ES6) कोड स्निपेट, चारालम्पोस केरपीडिस द्वारा। यह वर्तमान में 3+ मिलियन से अधिक इंस्टॉल के साथ सबसे लोकप्रिय जावास्क्रिप्ट स्निपेट एक्सटेंशन है। यह एक्सटेंशन जावास्क्रिप्ट, टाइपस्क्रिप्ट, HTML, रिएक्ट और Vue के लिए ES6 सिंटैक्स प्रदान करता है। सभी स्निपेट्स में एक अंतिम अर्धविराम शामिल होता है।

• StandardJS शैली में जावास्क्रिप्ट (ES6) कोड स्निपेटजेम्स विक्की द्वारा। यह मूल रूप से पसंद करने वालों के लिए उपरोक्त एक्सटेंशन का एक कांटा है StandardJS शैली सम्मेलनक्या है, स्निपेट्स में अर्धविराम नहीं हैं।

• जावास्क्रिप्ट मानक स्टाइल स्निपेट्स, कैपाज द्वारा। एक अन्य StandardJS स्टाइल स्निपेट्स लेकिन यह 72k से अधिक इंस्टॉल के साथ अधिक लोकप्रिय है। मूल रूप से कांटे से एटम StandardJS स्निपेट्स। आसान स्निपेट्स का एक विशाल संग्रह है और जावास्क्रिप्ट, टाइपस्क्रिप्ट और प्रतिक्रिया का समर्थन करता है।

• जावास्क्रिप्ट स्निपेट्स, नाथन चैपमैन द्वारा। लगभग 33k + के साथ जावास्क्रिप्ट स्निपेट का एक संग्रह आज तक स्थापित है। यह स्निपेट विस्तार Node.js, BDD परीक्षण ढाँचों जैसे मोचा और जैस्मीन का समर्थन करता है।

• एटम जावास्क्रिप्ट स्निपेट, सारण तानितपुकपोंग द्वारा। लगभग 26k + स्थापित होने की तिथि तक, इस एक्सटेंशन में स्निपेट से पोर्ट किए गए थे atom/language-javascript। जावास्क्रिप्ट स्निपेट्स परमाणु / भाषा-जावास्क्रिप्ट एक्सटेंशन से पोर्ट किए जाते हैं।

सिंटेक्स हाइलाइटिंग एक्सटेंशन

वीएस कोड का नवीनतम संस्करण बेहतर सिंटैक्स रंगीकरण का समर्थन करता है और अब एटम व्याकरण में निर्धारित मानकों के अनुरूप है। इसलिए, एक्सटेंशन जैसे जावास्क्रिप्ट एटम व्याकरण अब जरूरत नहीं है।

हालाँकि, हमारे पास अभी भी कुछ सिंटैक्स हाइलाइटिंग एक्सटेंशन हैं जो कुछ विशेष प्रकार की परियोजनाओं और फ़ाइल एक्सटेंशनों की बात करते समय काफी उपयोगी होते हैं। यहाँ कुछ है:

• बैबल जावास्क्रिप्ट, माइकल मैकडरमोट द्वारा। 550k + से अधिक तारीख तक स्थापित होने के साथ, यह एक्सटेंशन ES201x जावास्क्रिप्ट, रिएक्ट, फ्लो टाइप और ग्राफकॉल कोड के लिए सिंटैक्स हाइलाइटिंग प्रदान करता है।

• डॉटईएनवी, 833,737 के द्वारा। आज तक 833k से अधिक इंस्टॉलेशन के साथ, यह एक्सटेंशन पर्यावरण सेटिंग्स के लिए सिंटैक्स हाइलाइटिंग का समर्थन करता है - अर्थात, .env फाइलें.

• ब्रैकेट जोड़ी Colorizer 2, कोएनाड्रास द्वारा। 730k + इंस्टॉल के साथ, यह एक्सटेंशन विभिन्न रंगों के साथ मेल खाने वाले ब्रैकेट को हाइलाइट करता है, जिससे आपको यह पता चलता है कि कौन सा ब्रैकेट किस ब्लॉक से संबंधित है।

लिंटर एक्सटेंशन

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

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

यहां हमारे पास उपलब्ध एक्सटेंशन हैं:

• ईएसएलिंट, डिर्क बाएउमर द्वारा। 8 मिलियन से अधिक इंस्टॉल्स के साथ, यह सबसे लोकप्रिय एक्सटेंशन है, जो कि इसके लिए समर्थन प्रदान करता है ईएसएलिंट पुस्तकालय। कार्य के विस्तार के लिए, आपकी परियोजना को ESLint पैकेज और प्लग इन की आवश्यकता होगी। आपको एक निर्दिष्ट करने की भी आवश्यकता होगी .eslintrc, जो नियमों को निर्दिष्ट करेगा एक्सटेंशन आपके कोड को लिंट करने के लिए उपयोग करेगा।

• जेएसहिंट, डिर्क बाएउमर द्वारा। 1.2M + इंस्टॉल के साथ, यह एक्सटेंशन लाइनिंग को सपोर्ट करता है जेएसहिंट पुस्तकालय। ए .jshintrc अपने कोड को लिंट करने के लिए एक्सटेंशन के लिए कॉन्फ़िगरेशन फ़ाइल की आवश्यकता होती है।

• StandardJS - जावास्क्रिप्ट मानक शैली, सैम चेन द्वारा। यह एक्सटेंशन (259k + इंस्टॉल) बस एकीकृत करता है जावास्क्रिप्ट मानक शैली VS कोड में। आपको इंस्टॉल करना होगा standard or semiStandard अपनी परियोजना में एक देव निर्भरता के रूप में। कोई कॉन्फ़िगरेशन फ़ाइल आवश्यक नहीं है। आपको इस एक्सटेंशन को काम करने के लिए वीएस कोड की अंतर्निहित सत्यापनकर्ता को अक्षम करना होगा।

• जेएसलिंट, एंड्रयू Hyndman द्वारा। इस विस्तार के साथ लाइनिंग प्रदान करता है जेएसलिंट पुस्तकालय। आपको इंस्टॉल करना होगा jslint कार्य के विस्तार के लिए स्थानीय या वैश्विक स्तर पर। यह आज तक 109k + इंस्टॉल करता है।

यदि आप उपलब्ध लिंटर और उनके पेशेवरों और विपक्षों का अवलोकन चाहते हैं, तो हमारी जाँच करें जावास्क्रिप्ट लाइनिंग टूल की तुलना.

नोड पैकेज प्रबंधन एक्सटेंशन

हर जावास्क्रिप्ट प्रोजेक्ट को कम से कम एक npm पैकेज की जरूरत होती है, जब तक कि आप कोई ऐसा व्यक्ति नहीं है जो चीजों को कठिन तरीके से करना पसंद करता है। यहां कुछ वीएस कोड एक्सटेंशन दिए गए हैं जो आपको एनपीएम पैकेजों को अधिक आसानी से प्रबंधित करने और काम करने में मदद करेंगे।

• NPM, जैसे अहम्। 2.3M + इंस्टॉल से अधिक, यह एक्सटेंशन उपयोग करता है package.json स्थापित पैकेजों को मान्य करने के लिए। यदि कुछ भी गायब है या संस्करण बेमेल हैं, तो एक्सटेंशन आपको समस्या को ठीक करने के लिए क्लिक करने योग्य विकल्प प्रदान करेगा। इसके अलावा, आप npm स्क्रिप्ट को परिभाषित में भी चला सकते हैं package.json सही संपादक के अंदर।

-npm इंटेलीसेन, क्रिश्चियन कोहलर द्वारा। 1.9M + इंस्टॉल के साथ, यह एक्सटेंशन आयात विवरणों में स्वतः पूर्णता npm मॉड्यूल प्रदान करता है।

• पथ इंटेलीसेन, क्रिश्चियन कोहलर द्वारा। 2.7M + इंस्टॉल होने के साथ, यह एक्सटेंशन ऑटोकॉमप्लेट्स फाइलनाम करता है। यह HTML और CSS फाइलों के अंदर भी काम करता है।

• नोड निष्पादन, मीरामैक द्वारा। 168k + इंस्टॉल के साथ, यह एक्सटेंशन आपको वर्तमान फ़ाइल या अपने चयनित कोड को Node.js के साथ दबाकर निष्पादित करने की अनुमति देता है F8 अपने कीबोर्ड पर। आप दबाकर भी किसी रनिंग प्रक्रिया को रद्द कर सकते हैं F9.

• नोड पैकेज देखें डोमिनिक कुंडेल द्वारा। 55k + इंस्टॉल के साथ, यह एक्सटेंशन आपको अपने कोड के साथ काम करते समय एक नोड पैकेज स्रोत और प्रलेखन को जल्दी से देखने की अनुमति देता है।

• नोड रीडमे, बेंग्रीनियर द्वारा। 52k + इंस्टॉल के साथ, यह एक्सटेंशन आपको वीएस कोड संपादक के अंदर एक अलग टैब के रूप में एनपीएम पैकेज प्रलेखन को जल्दी से खोलने की अनुमति देता है।

• नोड_मॉडल खोजें, जेसन नट्टर द्वारा। डिफ़ॉल्ट रूप से, node_modules फ़ोल्डर को वीएस कोड की अंतर्निहित खोज से बाहर रखा गया है। 470k से अधिक इंस्टॉल के साथ, यह एक्सटेंशन आपको फ़ाइलों को जल्दी से नेविगेट करने और खोलने की अनुमति देता है node_modules फ़ोल्डर ट्री ट्रैवर्स करके।

स्रोत: vscode-खोज-नोड मॉड्यूल

• आयात लागत विक्स द्वारा। यह प्रदर्शित करता है कि जब आप इसे आयात करते हैं तो एक डिस्क स्थान एक पैकेज का कितना उपयोग कर रहा है। एक्सटेंशन में 562K + इंस्टॉल हैं।

स्रोत: आयात लागत

प्रारूपण एक्सटेंशन

अधिक बार नहीं, हम कभी-कभी कोड लिखते हैं जो बाकी कोड के साथ संरेखण से बाहर होता है। इसे ठीक करने के लिए, हमें वापस जाना होगा और प्रत्येक पंक्ति में इंडेंटेशन को ठीक करना होगा। इसके अलावा, हमें यह सुनिश्चित करने की आवश्यकता है कि ब्रेसिज़ और टैग एक पठनीय प्रारूप में ठीक से प्रारूपित हैं। यह प्रक्रिया जल्दी से थकाऊ हो सकती है।

सौभाग्य से, हमारे पास एक्सटेंशन हैं जो हमारे लिए काम कर सकते हैं। कृपया एक्सटेंशन को नोट करें Prettier और Beautify दोनों एक साथ सक्रिय नहीं हो सकते।

• प्रीटीयर कोड फॉर्मेटर, एसेन पीटरसन द्वारा। यह सबसे लोकप्रिय एक्सटेंशन है जो जावास्क्रिप्ट, टाइपस्क्रिप्ट और सीएसएस का उपयोग करके प्रारूपण का समर्थन करता है खूबसूरत। इसकी आज तक 5.7 मिलियन से अधिक इंस्टॉलेशन हैं। यह आप स्थापित करने की सिफारिश की है prettier स्थानीय रूप से देव निर्भरता के रूप में।

• सुशोभितद्वारा, HookyQR। ए जेएस ब्यूटिफायर विस्तार जो जावास्क्रिप्ट, JSON, CSS और HTML का समर्थन करता है। यह एक के माध्यम से अनुकूलित किया जा सकता है .jsbeautifyrc फ़ाइल। यह अब तक का दूसरा सबसे लोकप्रिय फॉर्मैटर है, जिसमें 4.4 मिलियन इंस्टॉलेशन हैं।

• जेएस रिफलेक्टर, क्रिस स्टीड द्वारा। यह जावास्क्रिप्ट कोड को फिर से तैयार करने के लिए कई उपयोगिताओं और कार्यों को प्रदान करता है, जैसे कि चर / तरीकों को निकालना, मौजूदा फ़ंक्शन को तीर फ़ंक्शन या टेम्पलेट शाब्दिक उपयोग करने के लिए परिवर्तित करना, और फ़ंक्शन निर्यात करना। यह 140k + स्थापित करने की तारीख है।

• जावास्क्रिप्ट बूस्टर, स्टीफन बरगूचेव द्वारा। यह एक अद्भुत कोड रीफैक्टरिंग उपकरण है। इसमें कई कोडिंग क्रियाएं शामिल हैं जैसे कि परिवर्तित करना var सेवा मेरे const or let, निरर्थक को दूर करना else बयान, और विलय और घोषणा। से प्रेरित है वेबस्टॉर्म, इसमें 74k + इंस्‍टॉल है।

स्रोत: vscode-जावास्क्रिप्ट-बूस्टर

ब्राउज़र एक्सटेंशन

जब तक आप जावास्क्रिप्ट में एक सांत्वना कार्यक्रम नहीं लिख रहे हैं, आप सबसे अधिक संभावना एक ब्राउज़र के अंदर अपने जावास्क्रिप्ट कोड को निष्पादित करेंगे। इसका मतलब है कि आपके द्वारा किए गए प्रत्येक कोड अपडेट का प्रभाव देखने के लिए आपको बार-बार पृष्ठ को ताज़ा करना होगा। हर समय मैन्युअल रूप से ऐसा करने के बजाय, यहां कुछ उपकरण दिए गए हैं जो आपकी पुनरावृत्ति प्रक्रिया के विकास के समय को काफी कम कर सकते हैं:

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

स्रोत: vscode-क्रोम डिबग

• लाइव सर्वर, रितविक डे द्वारा। यह एक्सटेंशन आपको स्थैतिक और गतिशील पृष्ठों के लिए लाइव पुनः लोड सुविधा के साथ एक स्थानीय विकास सर्वर लॉन्च करने की अनुमति देता है। इसमें 4.6M + स्थापित है।

स्रोत: vscode-क्रोम debugvscode-लाइव-सर्वर

• वेब सर्वर पर पूर्वावलोकन करेंद्वारा युचीनुकियामा। यह वेब सर्वर और HTML का लाइव पूर्वावलोकन प्रदान करता है। सुविधाओं को संदर्भ मेनू या संपादक मेनू से बुलाया जा सकता है। यह आज तक 120k + इंस्टॉल है।

• PHP सर्वर, brapifra द्वारा। PHP परियोजनाओं के लिए निर्मित, यह अभी भी जावास्क्रिप्ट कोड के परीक्षण के लिए उपयोगी है जिसे केवल क्लाइंट-साइड चलाने की आवश्यकता है। यह 234k + स्थापित करने की तिथि है।

• बाकी ग्राहक, हुआचाओ माओ द्वारा। अपने REST API समापन बिंदुओं का परीक्षण करने के लिए किसी ब्राउज़र या CURL प्रोग्राम का उपयोग करने के बजाय, आप इस उपकरण को अंतःक्रियात्मक रूप से HTTP अनुरोध संपादक के अंदर चलाने के लिए स्थापित कर सकते हैं। इसमें 834k + इंस्‍टॉल है।

फ्रेमवर्क एक्सटेंशन

अधिकांश परियोजनाओं के लिए, आपको अपने कोड की संरचना करने और अपने विकास के समय में कटौती करने के लिए एक उपयुक्त ढांचे की आवश्यकता होगी। वीएस कोड में एक्सटेंशन के माध्यम से अधिकांश प्रमुख रूपरेखाओं का समर्थन है। हालाँकि, अभी भी कई ऐसे स्थापित ढाँचे हैं जिनका अभी तक पूर्ण विकसित विस्तार नहीं है। यहाँ कुछ वी.एस. कोड एक्सटेंशन दिए गए हैं जो महत्वपूर्ण कार्यक्षमता प्रदान करते हैं।

• कोणीय स्निपेट्स (संस्करण 9), जॉन पापा द्वारा। 1.7+ मिलियन से अधिक इंस्टॉल के साथ, यह कोणीय डेवलपर्स के लिए सबसे लोकप्रिय स्निपेट एक्सटेंशन है। यह टाइपस्क्रिप्ट, आरएक्सजेएस, एचटीएमएल और डॉकर फ़ाइलों के लिए कोणीय स्निपेट्स प्रदान करता है। लेखन के समय, विस्तार को कोणीय 9 का समर्थन करने के लिए अद्यतन किया गया है।

• कोणीय 8 स्निपेट - टाइपस्क्रिप्ट, एचटीएमएल, कोणीय सामग्री, एनजीआरएक्स, आरएक्सजेएस और फ्लेक्स लेआउट, मिकेल मोरलंड द्वारा। इसमें कोणीय 2, 4, 5, 6,7 और 8 बीटा के लिए स्निपेट्स हैं। यह टाइपस्क्रिप्ट, HTML, कोणीय सामग्री ngRx, RxJS, PWA और फ्लेक्स लेआउट का समर्थन करता है। इसमें 242 कोणीय स्निपेट शामिल हैं, और वर्तमान में 1.35M + से अधिक स्थापित हैं।

• ES7 प्रतिक्रिया / Redux / GraphQL / प्रतिक्रिया-मूल निवासी स्निपेट्स, dsznajder द्वारा। आज तक 1.2M से अधिक इंस्टॉलेशन के साथ, यह एक्सटेंशन ES7 सिंटेक्स के साथ प्रतिक्रिया, Redux और Graphql के लिए जावास्क्रिप्ट और टाइपस्क्रिप्ट स्निपेट्स प्रदान करता है।

• प्रतिक्रियाशील उपकरण, Microsoft द्वारा। यह IntelliSense, React Native प्रोजेक्ट्स के लिए कमांड और डीबगिंग सुविधाएँ प्रदान करता है। यह अब तक 1.2 मिलियन से अधिक इंस्टाल है।

• Es6 / es7 के लिए प्रतिक्रियाशील-मूल / प्रतिक्रिया / Redux स्निपेटEQuimper द्वारा। यह ES6 / ES7 सिंटैक्स में React, React Native, Redux और स्टोरीबुक के लिए ES6 / ES7 सिंटैक्स में स्निपेट्स प्रदान करता है। इसमें 371k + इंस्टॉल है।

• वेतुर, पाइन वू द्वारा। यह सिंटैक्स हाइलाइटिंग, स्निपेट्स, एम्मेट, लाइनिंग, फ़ॉर्मेटिंग, इंटेलीजेंस और Vue फ्रेमवर्क के लिए डिबगिंग समर्थन प्रदान करता है। यह उचित प्रलेखन के साथ आता है GitBook। यह अब तक 4.2 मिलियन से अधिक इंस्टाल है।

• अंगार, फेलिक्स रिसेबर्ग द्वारा। यह एम्बर के लिए कमांड सपोर्ट और इंटेलीसेन प्रदान करता है। स्थापना के बाद, सभी ember cli कमांड वीएस कोड की अपनी कमांड सूची के माध्यम से उपलब्ध हैं। यह आज तक 18k + इंस्टॉल है।

• कॉर्डोवा उपकरण, Microsoft द्वारा। यह कॉर्डोबा प्लगइन्स और आयोनिक फ्रेमवर्क के लिए समर्थन प्रदान करता है, और कॉर्डोवा-आधारित परियोजनाओं के लिए इंटेलीसिन, डीबगिंग और अन्य समर्थन सुविधाएँ भी प्रदान करता है। इसमें 272k + इंस्‍टॉल है।

• jQuery कोड स्निपेट, डॉन जयमनने द्वारा। यह 130 से अधिक jQuery कोड स्निपेट्स प्रदान करता है। यह उपसर्ग द्वारा सक्रिय है jq, और आज तक 700k + इंस्टॉल है।

परीक्षण एक्सटेंशन

परीक्षण सॉफ्टवेयर विकास का एक महत्वपूर्ण हिस्सा है, खासकर उन परियोजनाओं के लिए जो उत्पादन के चरण में हैं। आप जावास्क्रिप्ट में परीक्षण का एक व्यापक अवलोकन प्राप्त कर सकते हैं और हमारे गाइड में चल रहे विभिन्न प्रकार के परीक्षणों के बारे में अधिक पढ़ सकते हैं, "जावास्क्रिप्ट परीक्षण: यूनिट बनाम कार्यात्मक बनाम एकीकरण टेस्ट"। परीक्षण के लिए कुछ लोकप्रिय वीएस कोड एक्सटेंशन यहां दिए गए हैं।

• मोचा साइडबार, मैट द्वारा। यह मोचा लाइब्रेरी का उपयोग करके परीक्षण के लिए समर्थन प्रदान करता है। यह एक्सटेंशन आपको कोड पर सीधे परीक्षण चलाने में मदद करता है और सज्जाकार के रूप में त्रुटियों को दिखाता है। यह 68k + स्थापित करने की तारीख है। ध्यान दें कि इस विस्तार में लेखन के समय कई अनसुलझे मुद्दे हैं।

• ईएस 6 मोचा स्निपेट्स, कोरी नूनन द्वारा। यह ईएस 6 सिंटैक्स में मोचा स्निपेट्स प्रदान करता है। इस विस्तार का फोकस कोड को सूखा रखना, तीर के कार्यों को छोड़ना और जहां संभव हो वहां पर कर्लिंग को छोड़ना है। इसे अर्धविराम की अनुमति देने के लिए कॉन्फ़िगर किया जा सकता है, और आज तक 36k + इंस्टॉल है।

• जैस्मीन कोड स्निपेट्स, चारालम्पोस केरपीडिस द्वारा। यह जैस्मीन परीक्षण ढांचे के लिए कोड स्निपेट्स प्रदान करता है। यह आज तक 30k + इंस्टॉल है। दुर्भाग्य से, लेखन के समय यह एक्सटेंशन पिछले तीन वर्षों में अपडेट नहीं किया गया है।

• प्रोटेक्टर स्निपेट्स, बुदी इरावन द्वारा। यह प्रोटेक्टर फ्रेमवर्क के लिए एंड-टू-एंड टेस्टिंग स्निपेट प्रदान करता है। यह जावास्क्रिप्ट और टाइपस्क्रिप्ट दोनों का समर्थन करता है, और इसमें 18k + इंस्टॉल है।

• नोड टीडीडी, प्रशांत तिवारी द्वारा किया गया। यह नोड और जावास्क्रिप्ट परियोजनाओं के लिए परीक्षण-संचालित विकास के लिए समर्थन प्रदान करता है। जब भी स्रोत अपडेट किए जाते हैं तो यह एक स्वचालित परीक्षण बिल्ड को ट्रिगर कर सकता है। यह आज तक 23k + इंस्टॉल है।

स्रोत: नोड-TDD

बहुत बढ़िया एक्सटेंशन

मैं बस वीएस कोड एक्सटेंशन के इस अगले समूह को "भयानक" श्रेणी में डाल रहा हूं, क्योंकि यह सबसे अच्छा वर्णन करता है!

• Quokka.js, Wallaby.js द्वारा। एक भयानक डिबगिंग उपकरण जो जावास्क्रिप्ट कोड के लिए एक तेजी से प्रोटोटाइप खेल का मैदान प्रदान करता है। यह इसके साथ आता है उत्कृष्ट प्रलेखन, और 641k से अधिक स्थापित है।

• JSON के रूप में चिपकाएँQuicktype द्वारा। यह आपको JSON डेटा को जावास्क्रिप्ट कोड में जल्दी से बदलने की अनुमति देता है, और आज तक 430k से अधिक इंस्टाल है।

स्रोत: त्वरित प्रकार

• कोड मेट्रिक्स, चुंबन तमस द्वारा। यह एक और भयानक विस्तार है जो जावास्क्रिप्ट और टाइपस्क्रिप्ट कोड में जटिलता की गणना करता है। यह 233k से अधिक स्थापित है।

स्रोत: कोडेमेट्रिक्स

एक्सटेंशन पैक

अब जब हम अपनी अंतिम श्रेणी में आ गए हैं, तो मैं आपको बताना चाहूंगा कि VS कोड मार्केटप्लेस है एक्सटेंशन पैक के लिए एक श्रेणी। अनिवार्य रूप से, ये आसान स्थापना के लिए एक पैकेज में बंडल किए गए संबंधित वीएस कोड एक्सटेंशन के संग्रह हैं। यहाँ कुछ बेहतर हैं:

• Nodejs एक्सटेंशन पैक, वेड एंडरसन द्वारा। इस पैक में ESLint, npm, JavaScript (ES6) स्निपेट, सर्च नोड_मॉड्यूल्स, NPM IntelliSense और Path IntelliSense शामिल हैं। इसमें 293K से अधिक इंस्टाल हैं।

• Node.js के लिए VS कोड - विकास पैक, NodeSource द्वारा। यह एक NPM IntelliSense, ESLint, क्रोम के लिए डीबगर, कोड मेट्रिक्स, डॉकर और आयात लागत है। यह आज तक 103k से अधिक स्थापित है।

• Vue.js एक्सटेंशन पैक, मुहम्मद उबैद रजा द्वारा। यह Vue और JavaScript एक्सटेंशन का संग्रह है। इसमें वर्तमान में लगभग 12 वीएस कोड एक्सटेंशन हैं, जिनमें से कुछ का उल्लेख यहां नहीं किया गया है, जैसे कि ऑटो नाम बदलने टैग और ऑटो बंद टैग। यह अब तक 156k से अधिक स्थापित है।

• आयोनिक एक्सटेंशन पैक, लोयन ग्रोनर द्वारा। इस पैक में Ionic, Angular, RxJS, Cordova और HTML विकास के लिए कई VS कोड एक्सटेंशन हैं। यह आज तक लगभग 75k इंस्टाल है।

सारांश

वीएस कोड की गुणवत्ता एक्सटेंशन की बड़ी संख्या इसे जावास्क्रिप्ट डेवलपर्स के लिए एक लोकप्रिय विकल्प बनाती है। जावास्क्रिप्ट कोड को कुशलतापूर्वक लिखना कभी आसान नहीं रहा। ESLint जैसे एक्सटेंशन आपको सामान्य गलतियों से बचने में मदद करते हैं, जबकि अन्य जैसे कि डीबगर के लिए Chrome आपकी कोड को अधिक आसानी से डीबग करने में आपकी सहायता करता है। Node.js एक्सटेंशन, उनकी IntelliSense सुविधाओं के साथ, आप मॉड्यूल को सही ढंग से आयात करने में मदद करते हैं, और लाइव सर्वर और REST क्लाइंट जैसे उपकरणों की उपलब्धता आपके काम को पूरा करने के लिए बाहरी उपकरणों पर निर्भरता को कम करती है। ये सभी उपकरण आपकी पुनरावृत्ति प्रक्रिया को बहुत आसान बनाते हैं।

मुझे आशा है कि यह सूची आपको नए वीएस कोड एक्सटेंशन में पेश की गई है जो आपके वर्कफ़्लो में आपकी मदद कर सकते हैं।

अगला, विजुअल स्टूडियो कोड का लाभ उठाने का तरीका जानें, हमारे साथ अपने विकास वर्कफ़्लो को सुपरचार्ज करने के लिए विजुअल स्टूडियो कोड पावर यूजर गाइड.

स्रोत: https://www.sitepoint.com/vs-code-extensions-javascript-developers/?utm_source=rss