14 bedste VS-kodeudvidelser til udviklere

Visual Studio Code, eller VS Code, er en af ​​de mest populære kildekoderedaktører, som udviklere bruger. For at øge dit softwareudviklingsprojekts produktivitet kan du bruge nogle af de bedste VS Code-udvidelser, der er nævnt i denne artikel.

Du får en fantastisk klar oplevelse, når du begynder at redigere software eller websides kildekoder på Visual Studio Code. Men som udvikler kan du altid kræve flere funktionaliteter i denne næsten integrerede udviklingsmiljø (IDE) kodeeditor.

VS Code Marketplace bør være din destination for alle slags VS IDE-udvidelser. Fortsæt med at læse denne artikel for at finde de bedste VS IDE-udvidelser, du kan bruge i din webapp eller Windows-appudviklingsprojekter.

Populariteten af ​​Visual Studio Code

Ifølge WakaTime statistik om programmering, udviklere har brugt VS Code editor i mere end 21 millioner timer. Det var den #1 kodeeditor for 2021, når man sammenlignede timers koderedigering i andre værktøjer som IntelliJ (>3 millioner timer) og PhpStorm (>2 millioner timer).

Her er nogle grunde til, at de fleste udviklere foretrækker VS-kode frem for andre kildekode-editorer:

#1. Det er helt gratis, open source og leveres med understøttelse på tværs af platforme. Det betyder, at det fungerer på Linux, Windows og macOS.

#2. Editoren har en indbygget debugger. Derfor skal du lave færre klik. Desuden kan du holde øje med dit kodningsprojekt såvel som debuggeren i et enkelt vindue uden at skulle skifte apps.

#3. VS-kode kommer ud af æsken med IntelliSense, også kendt som prædiktiv kodning.

#4. Du kan nemt konvertere VS Code-appen til en fuld-stack-arbejdsstation med de rigtige genvejstaster, VS Code-udvidelser og indstillinger.

Hvad er Visual Studio IDE-udvidelser?

VS Code er en superorganiseret kildekodeeditor, der understøtter software- og appudviklingsoperationer som versionskontrol, fejlfinding og opgavekørsel. Det giver udviklerne en effektiv platform til en ubesværet kode-build-debug-cyklus for de fleste programmeringssprog. Du skal dog bruge en IDE som Visual Studio til komplekse arbejdsgange.

For at overvinde manglerne er udviklere kommet med VS Code-udvidelser. Udvidelser er blot tilføjelser, som du kan installere i VS Code-appen og få adgang til nye funktionaliteter. VS IDE-udvidelser øger primært produktiviteten og gør kodning lettere og fejlfri.

Hvorfor er IDE-udvidelser nyttige?

Primært kan du bruge VS Code-udvidelser til at forbedre værktøjets anvendelighed til forskellige software- og appudviklingsprojekter. Hvis projektet kræver en bestemt funktionalitet, som VS Code mangler, kan du søge på markedspladsen efter en udvidelse.

Ydermere hjælper udvidelser dig med at øge produktiviteten af ​​dit app-udviklingsteam. Du kan undgå unødvendige fejl under kodning ved at bruge kodefuldførelsesudvidelser.

Desuden er der avancerede udvidelsespakkeinstallatører, der kan hjælpe dig med at importere reposer til DevOps-projekter fra pakkehostingswebsteder. I en nøddeskal giver udvidelser dig mulighed for at konvertere VS-koden til en full-service IDE.

  Sådan rettes Adobe Save for Web-fejlen i Photoshop

Lad os nu se på nogle af de bedste VS-kodeeditorer.

Indstillinger Synk

Du kan tjekke ud Indstillinger Synk VS IDE-udvidelse fra Visual Studio-markedspladsen, hvis du har brug for at synkronisere uddrag, indstillinger, temaer, tastebindinger, filikoner, arbejdsområder osv. på tværs af forskellige maskiner under udviklingsprojektet. Udvidelsen bruger GitHub Gists.

Nogle fantastiske funktioner er:

  • Du kan bruge din eksisterende GitHub-konto Gist og tokens.
  • Download de seneste ændringer af indstillinger automatisk.
  • Indstillinger for automatisk upload, når der er en ændring i filen.

Udvidelsen har allerede set mere end 3 millioner installationer. Ydermere er tilføjelsen gratis til enhver form for udviklingsarbejde. Der er dog måder at støtte udviklerne af dette værktøj på, hvis du vil.

Live server

Hvis du arbejder med hjemmesideudvikling i VS Code og har brug for at visualisere dit arbejde indtil videre, kan du bruge Live server. Det opretter en lokal og midlertidig server kun til webstedet, der udvikles. Du kan visualisere både dynamiske og statiske webstedssider ved hjælp af denne udvidelse.

Nogle fremtrædende træk er:

  • Live og genindlæselig browserbaseret webserver til websitevisualisering.
  • Brugere kan stoppe eller starte serveren med et enkelt klik fra tilføjelsens statuslinje.
  • Kompatibel med Chrome Debugging Attaching.

Værktøjet er frit tilgængeligt og har været vidne til mere end 23 millioner installationer indtil videre.

Visual Studio Code Remote – SSH

Fjernbetjeningen – SSH tilføjelse til VS-kode lader dig bruge enhver fjern-pc med en SSH-server som din IDE. Det vil i høj grad forbedre fejlfinding og udvikling i forskellige situationer. Nogle bemærkelsesværdige funktioner er:

  • Udvikl apps og software på en sofistikeret fjernarbejdsstation ved at få adgang til den fra din lokale computer.
  • Skift øjeblikkeligt mellem forskellige udviklingsmiljøer uden at påvirke din lokale computers ydeevne.
  • Samarbejd på en eksisterende IDE fra flere fjernmaskiner.

Det bedste er, at du ikke behøver at installere nogen kildekode på den lokale arbejdsstation. Tilføjelsen kører kommandoer og andre VS IDE-udvidelser direkte på fjerncomputeren.

Pænere – Kodeformater

Hvis du ønsker at implementere en fælles stilguide på tværs af alle udviklingsprojekter i dit team, skal du prøve Kønnere tilføjelse til VS-kode. Her er nogle funktioner i denne tilføjelse, som du bør kende:

  • Udtalt kodeformateringsudvidelse
  • Integreres med mange kodeeditorer
  • Stildiskussioner bliver ubrugelige, når du bruger dette værktøj
  • Det sparer dig for energi og tid

Nogle gange kan du som udvikler have brug for at arbejde på en inkonsekvent kodebase. Du kan nemt rense og omformatere en eksisterende kodebase ved hjælp af denne udvidelse på VS Code.

npm

Hvis du arbejder på JavaScript-projekter, skal du prøve npm som pakkeansvarlig. Nu, når du skal flytte dit arbejde til VS Code editor, kan du gøre det. Fordi npm-udvidelsen lader dig nyde npm-understøttelsen på VS Code editor ligesom andre IDE’er.

  Sådan ændres kerning i Microsoft Word

Nogle af de indbyggede kommandoer er:

  • Genkalder det sidste npm-script, som du brugte efter installationen af ​​denne udvidelse.
  • Kør et npm-script
  • Afslutning af kørende scripts
  • Kør npm installation

Dette er en Microsoft-udviklet VS Code-udvidelse, der har registreret mere end 5 millioner installationer.

Projektleder

Hvis du er projektleder for softwareudvikling og overvåger flere DevOps-projekter på VS Code, bør du prøve det Projektleder. Værktøjet giver dig adgang til alle projekter fra én computer, uanset hvor projekterne er tilgængelige.

Der er bestemmelser til at definere projekter, så du nemt kan organisere dem. Nogle bemærkelsesværdige funktioner er:

  • Gem mapper eller arbejdsområder som projekter
  • Tag dine projekter til avanceret organisation
  • Åbn alle projekter i det nye eller samme vindue
  • Identificer nemt omdøbte eller slettede projekter

Desuden har udvidelsen været vidne til over 2 millioner installationer.

SonarLint

SonarLint er en open source Visual Studio-udvidelse, der giver dig mulighed for at løse kodningsproblemer, før de vises. Tilføjelsen fremhæver sikkerhedssårbarheder og fejl, mens du skriver koden i Visual Studio. Dens grænseflade er enkel og fungerer ligesom en stavekontrolapp i enhver teksteditor.

Ydermere giver værktøjet dig klar opløsningsvejledning. Således får du chancen for at rette koden, inden arbejdsgangen forpligter sig til programmet. Desuden understøtter udvidelsen af ​​VS Code forskellige programmeringssprogsanalyser som C++, C, Java, HTML, PHP, JavaScript, TypeScript og Python.

Stylelint

Leder du efter et automatiseret værktøj, der vil markere kodningsfejl, stilistiske fejl, fejl og andre mistænkelige konstruktioner på VS Code? Du kan prøve Stylelint, en linter-udvidelse til VS Code, der er nem at installere. Bortset fra markering tvinger det dit udviklingsteam til at holde sig til forhåndsgodkendte kodestyling-konventioner for at undgå skrammel og skrald i din software eller app-kode.

Nogle bemærkelsesværdige funktioner:

  • Plugin-understøttelse til personlig regeloprettelse
  • For moderne CSS-funktioner og syntakser har den 170+ indbyggede regler
  • Nogle gange løser den kodeproblemer automatisk, når den forstår ethvert mønster

VS Marketplace viser 700.000 installationer for denne tilføjelse.

CSS-kig

Vil du slippe for at skulle skifte over til din .css-fil for at inspicere egenskaberne knyttet til et id eller en klasse? Du skal prøve CSS-kig tilføjelse til VS-kode. Det lader dig se svævebilledet af CSS-kode fra HTML-filen.

Udvidelsen konverterer også ID’er og klassenavne til hyperlinks. Når du klikker på disse hyperlinks, kan du således øjeblikkeligt få adgang til ID-definitionen og klassen for din CSS.

Denne tilføjelse har registreret mere end 3 millioner installationer. Du kan installere værktøjet i VS Code gratis.

Polacode

Polacode er en tilføjelse til VS-kode, der giver dig mulighed for øjeblikkeligt at skabe smukke skærmbilleder af din software eller app-kode. Derefter kan du bruge den resulterende komponent til at dele dit kodningsarbejde med samarbejdspartnere, venner eller kunder. Det bedste er, at det beholder alle de eksisterende VS Code-temaer og kodeskrifttyper. Tilføjelsen sætter bare koden ind i et flot layout, der ser professionelt ud.

  Sådan indstilles en timer i zoom

Udvidelsen kommer med en trækfunktion til at ændre størrelsen på beholderen eller kodestykket. Du skal bare holde og trække i nederste højre hjørne. Andre kommandoer, som du kan bruge til at styre billedets udseende, er polacode.shadow, polacode.target, polacode.backgroundColor osv.

GitLens — VS Code Extension

GitLens, en gratis VS-kodeudvidelse, hjælper simpelthen kodere til bedre at forstå programmeringskoderne. Du kan hurtigt finde ud af, hvorfor, hvornår og hvem der har ændret en kodeblok eller en kodelinje.

Yderligere kan du også gennemgå kodehistorikken for at få brugbar indsigt i, hvorfor og hvordan et stykke kode har udviklet sig. Derfor kan projektlederne ubesværet udforske udviklingen eller historien om en kodebase.

Udvidelsen er også tilgængelig som GitLens+. Den har to abonnementstilstande. Du kan enten logge ind med en gratis konto og dele data med GitLens+ udvikleren eller åbne en betalt konto. Du kan bruge den gratis konto til offentlige reposer og den betalte konto til private reposer.

Importomkostninger

Importomkostninger er en VS Code-tilføjelse, der lader dig visualisere filstørrelsen på et importeret tredjepartsbibliotek. Det viser importomkostningsværdien, så snart du importerer biblioteket i VS Code editor.

Du vil se bibliotekets størrelse inline, mens du indtaster koden. For at se størrelsen på den importerede biblioteksfil bruger den en webpack. Nogle bemærkelsesværdige funktioner er:

  • Bibliotekstørrelse for hele indholdsimport
  • Vis størrelse til standardimport
  • Kompatibel med Typescript og JavaScript programmeringssprog.

Tilføjelsen har registreret mere end 1 million installationer.

Sti Intellisense

Normalt skal du håndtere flere filer, når du arbejder på et software- eller appudviklingsprojekt. Når du skriver en kode, skal du indtaste filnavnet, som det er fra din egen hukommelse. Nu, da filnavnene indeholder bindestreger, bliver det en udfordrende opgave at huske dem. Her kan du få hurtig hjælp fra Sti Intellisense.

Det er en udvidelse, der autofuldfører filnavne i en kodebase. Værktøjet foreslår øjeblikkeligt den fil, du leder efter, når det registrerer begyndelsesbogstaverne. Det kan også hjælpe dig med at gøre skjulte filer synlige.

JavaScript Debugger (natlig)

Det er en debug adapter protokol (DAP) baseret JavaScript program debugger. Værktøjet lader dig fejlfinde Chrome, Node.js, WebView2, Edge, VS Code-tilføjelser og mange flere. Siden VS Code version 1.46 har JavaScript Debugger været standard debug-tilføjelsen. Microsoft ruller også gradvist værktøjet ud til Visual Studio IDE.

Denne VS Code-udvidelse er et open source-værktøj fra Microsoft. Du kan frit bruge det til enten kommercielle eller ikke-kommercielle udviklingsformål. Værktøjet har optaget over 600.000 installationer indtil videre.

Afsluttende ord

Indtil videre har du opdaget nogle af de bedste VS Code-udvidelser, du skal bruge, hvis du elsker at arbejde på Microsoft Visual Studio Code. Det er et førende navn i økosystemet af open source-kodeeditorer. Afhængigt af dine projektkrav kan du installere enhver af ovenstående VS IDE-udvidelser.

Denne ultimative liste over de bedste VS IDE-udvidelser hjælper dig med at spare den tid, du ville have investeret i at søge efter disse værktøjer. Nu kan du dedikere mere tid til dit projekt, da du allerede ved, hvilke udvidelser der er gode.

Du kan også tjekke nogle af de bedste IDE’er, som enhver programmør bør kende til.