5 VS Code-funksjoner som sparer meg tid hver dag

Jeg bruker VS Code nesten hver dag. En ting som henger ved meg om det er at det kan gjøre så mye av det tunge arbeidet for deg. Gjør du repeterende redigeringer? Leter du etter filer i sidepanelet? Skriver du samme mal på nytt for hundrede gang? VS Code kan gjøre alt dette enklere for deg. La oss se nærmere på hvordan.

Redigering med flere markører

En av de mest kontraproduktive oppgavene du kan gjøre mens du programmerer, er å redigere det samme om og om igjen. Tenk deg at et variabelnavn dukker opp 12 ganger. En CSS-klasse må oppdateres på 8 steder. Du endrer det én gang, leter etter neste forekomst, så den neste. Inntil fokuset ditt er helt borte, er det en irriterende oppgave som fortsetter å bygge seg opp.

I stedet for å redigere ett sted om gangen, lar VS Code deg plassere flere markører og skrive i alle samtidig. Hver tastetrykk speiles på alle markører, noe som betyr at gjentatte redigeringer plutselig tar sekunder i stedet for minutter.

Den enkleste måten å komme i gang på er å legge til markører manuelt:

Windows/Linux: Hold nede Alt og klikk der du vil ha en ny markør
macOS: Hold nede Alternativ og klikk

For smartere valg, plasser markøren på et ord og trykk:

Ctrl + D (Windows/Linux) eller Cmd + D (macOS) for å velge neste matchende forekomst
Ctrl + Shift + L (Windows/Linux) eller Cmd + Shift + L (macOS) for å velge alle forekomster på en gang

Når markørene er på plass, er det bare å skrive. VS Code gjør resten. Redigering med flere markører er perfekt for å refaktorere variabler, redigere gjentakende merking eller rydde opp i rotete data. Hvis du går litt for langt, vil trykk på Esc umiddelbart bringe deg tilbake til en enkelt markør.

Rask navigering mellom filer

Hvert prosjekt starter lite. Så plutselig jobber du i en kodebase med dusinvis eller hundrevis av filer. Kontroller, tjenester, komponenter, verktøy, konfigurasjoner. Og du hopper konstant mellom dem. Du åpner filutforskeren, blar, utvider mapper, mister oversikten over hvor du var, og gjentar prosessen.

VS Code gir deg raskere måter å hoppe mellom filer på uten å bruke musen. Det hemmelige våpenet her er Quick Open. Det lar deg søke etter og åpne hvilken som helst fil i prosjektet ditt nesten umiddelbart, bare ved å bruke tastaturet ditt.

Åpne det med Ctrl + P (Windows/Linux) eller Cmd + P (macOS). Begynn å skrive en del av filnavnet. VS Code bruker fuzzy matching, så du trenger ikke det eksakte navnet. Trykk Enter for å åpne filen.

Du trenger ikke å stoppe der. Hvis du vil søke etter symboler, funksjoner eller klasser, skriv @ i Rask Åpne-menyen mens filen du vil gå til er valgt, så får du en liste over disse som du kan hoppe til.

En annen nyttig snarvei jeg liker er å navigere mellom de åpne fanene. For å hoppe til en fane, kan du bruke Alt + fane nummer (1,2,3...) på Windows og Ctrl + fane nummer på macOS. Hvis du vil gå gjennom dem, bruker du Ctrl + Tab. Dette er nyttig når du har noen få filer åpne, og du ikke vil bruke musen hver gang.

Forhåndsvis Markdown-filer

Å skrive Markdown uten en forhåndsvisning er litt som å kode uten å kjøre appen din. Du vet at det burde fungere, men du gjetter hele tiden på hvordan det faktisk vil se ut.

VS Code løser dette ved å la deg forhåndsvise Markdown-filer direkte i editoren, side om side med kilden din. Du skriver på den ene siden, ser det gjengitte resultatet på den andre, og holder hele tiden flyten.

For å forhåndsvise en Markdown-fil i VS Code, åpne en Markdown-fil. Start forhåndsvisningen med Ctrl + Shift + V (Windows/Linux) eller Cmd + Shift + V (macOS). Hvis du vil se forhåndsvisningen og den rå filen side om side, trykk Ctrl + K og deretter V.

Mens du skriver, oppdateres forhåndsvisningen i sanntid og viser nøyaktig hvordan Markdown-en din vil gjengis.

Gi symbolene nytt navn i hele filen

Å gi ting nye navn er lurvete farlig. Du endrer navnet på en variabel ett sted, og bruker deretter de neste minuttene på å lete etter alle andre referanser, i håp om at du ikke overser noen. Enda verre, en uforsiktig søk-og-erstatt kan endre ting den ikke bør, og etterlate subtile feil som først viser seg senere.

VS Code fjerner risikoen ved dette med symbol-omdøping. I stedet for å bytte ut tekst blindt, forstår det koden din og endrer navnet på symbolet overalt det faktisk brukes. Plasser markøren på variabelen, funksjonen eller symbolet du vil omdøpe, og trykk F2. Skriv inn det nye navnet og trykk Enter.

VS Code oppdaterer umiddelbart alle gyldige referanser i filen (og ofte på tvers av prosjektet, avhengig av språkstøtte).

Bruk kodesnutter

Det finnes en spesiell type frustrasjon som kommer av å skrive den samme standardkoden om og om igjen. En React-komponent, en try/catch-blokk, en for-løkke og en testoppsett. Du vet allerede hvordan det ser ut, men fingrene dine må fortsatt gjøre alt arbeidet.

Kodeutdrag gjør den gjentakelsen om til en snarvei. Utdrag lar deg generere hele kodeseksjoner fra noen få tastetrykk. De er smarte, raske og tilpassbare.

VS Code leveres med innebygde snippets for mange språk. Begynn bare å skrive noe kjent, og trykk Tab når forslaget vises. I andre tilfeller kan du finne utvidelser for språk eller rammeverk du jobber med.

Men det beste med utdrag er at du kan lage dine egne. Åpne kommandopalletten (Ctrl + Shift + P/Cmd + Shift + P) og søk etter 'Konfigurer utdrag'. Du kan enten lage et globalt utdrag eller velge et språk.

Når de er lagret, er dine egendefinerte utdrag tilgjengelige overalt.