Hur man konfigurerar vs kod för programmering - Teknik och mycket mer kan du se här!

Visual Studio Code (VS Code) är en av de kodredigerare som är mest älskade av utvecklare. Dess höga anpassning gör att du kan anpassa utvecklingsmiljön exakt efter dina behov.

Från installation till konfigurering av teman, tillägg och kortkommandon, VS Code erbjuder otaliga alternativ för att förbättra din produktivitet.

Den här artikeln guidar dig genom de väsentliga stegen för att ställa in VS-kod för programmering.

Installera VS Code

Ladda ner installationsprogrammet

För att börja ställa in VS Code är det första steget att ladda ner installationsprogrammet. Gå till den officiella VS Code-webbplatsen och klicka på nedladdningsknappen.

Webbplatsen kommer automatiskt att identifiera ditt operativsystem och tillhandahålla lämpligt installationsprogram.

Kör installationen

När nedladdningen är klar, klicka på den nedladdade filen för att påbörja installationen. Följ instruktionerna på skärmen genom att klicka på "Nästa" i stegen.

Glöm inte att acceptera användarvillkoren. Välj mappen där VS Code ska installeras och fortsätt.

Konfigurera PATH

I det sista installationssteget väljer du alternativet "Lägg till i PATH". Detta är viktigt så att du kan öppna VS Code direkt från terminalen med kommandot koda.

Efter att ha markerat det här alternativet, klicka på "Installera" och, när installationen är klar, klicka på "Slutför" för att slutföra.

Redo! Nu är VS Code installerad och konfigurerad på ditt system. Låt oss gå vidare till nästa steg och börja utforska funktionerna i detta kraftfulla programmeringsverktyg.

Escolhendo Temas e Esquemas de Cores

Åtkomst till inställningar

För att anpassa VS-kod, gå till inställningar. Gå till menyn Arkiv > Inställningar > Färgtema eller bara skriv Inställningar: Färgtema i kommandopaletten. Detta öppnar en lista över tillgängliga teman som du kan välja mellan.

Populära teman

Det finns många populära teman som kan anpassa redigeraren till din smak. Några av de mest kända är:

One Dark Pro: Ett mörkt tema som är ganska populärt bland utvecklare.
Atom One Light: Perfekt för dem som föredrar ett tydligt tema.
Dracula: Ett mörkt tema utvecklat av Zeno Rocha, en brasilian.
Material Ikon Tema: Förutom färgteman kan du ändra filikoner till materialdesignstil.

Anpassa ditt tema

Om inget av standardteman tilltalar dig kan du anpassa dina egna. Tillträde Arkiv > Inställningar > Inställningar och sök efter workbench.colorCustomizations.

Här kan du justera färgerna på olika element i VS Code-gränssnittet.

Dricks: Du kan lägga till färganpassningar till titel- och statusfälten i avsnittet färganpassningar.

Med dessa tips kan du göra VS Code till din egen och göra programmering ännu roligare!

Installera Essential Extensions

Utforska Marketplace

För att installera tillägg i VS Code, gå till Marketplace. Marknadsplatsen är där du hittar alla tillägg som är tillgängliga för VS Code. För att komma åt det:

Öppna VS-kod.
Klicka på tilläggsikonen i det vänstra sidofältet eller tryck Ctrl+Skift+X.
Använd sökfältet för att hitta de tillägg du vill ha.
Klick Installera för att lägga till tillägget till din VS-kod.

Rekommenderade tillägg

Här är några tillägg som avsevärt kan förbättra din produktivitet:

Auto Byt namn på tagg: Byter automatiskt namn på motsvarande HTML-taggar när du ändrar en av dem.
Färgmarkering: Framhäver färgerna i din CSS-kod, vilket gör det lättare att se färgerna som används.
LiveServer: Skapar en lokal server som automatiskt uppdaterar din sida i webbläsaren när du sparar en fil.
Sötare: Formaterar din kod automatiskt, vilket säkerställer en konsekvent stil.
ESLint: Analyserar din JavaScript-kod för fel och stilproblem.
GitLens: Förbättrar Git-integrationen i VS Code genom att visa detaljerad information om commits och författare.

Hantera dina tillägg

När du har installerat vissa tillägg kanske du vill hantera dem. För det:

Öppna tilläggspanelen (Ctrl+Skift+X).
Klicka på kugghjulsikonen bredvid tillägget du vill hantera.
Du kan inaktivera, avinstallera eller konfigurera tillägget efter behov.

Komma ihåg: Mindre är mer. Installera bara de tillägg du faktiskt kommer att använda för att undvika att överbelasta din editor.

Konfigurera kodformatering

Justera formateringsinställningar

Du kan justera din kods formateringsinställningar i VS Code. Öppna inställningarna genom att trycka på CTRL (CMD) + , och leta efter "Formatera vid spara".

Aktivera det här alternativet så att koden formateras automatiskt när du sparar en fil.

Formatering på Spara

En av VS Codes mest användbara funktioner är automatisk formatering vid spara. Detta säkerställer att din kod alltid är ren och organiserad.

För att aktivera det här alternativet, lägg till följande rad i din fil settings.json:

{
    "editor.formatOnSave": sant
}

Använda vackrare och andra verktyg

Prettier är ett populärt verktyg för att formatera kod. Det hjälper dig att behålla en konsekvent stil genom hela ditt projekt. För att använda det, följ dessa steg:

Installera Prettier-tillägget i VS Code.
Lägg till snyggare inställningar till din settings.json:

{
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    }
}

Nu, varje gång du sparar en fil, kommer Prettier att formatera koden automatiskt.

Att hålla koden välformaterad förbättrar inte bara läsbarheten utan hjälper också till att undvika onödiga fel.

Prova olika verktyg och hitta det som bäst passar ditt arbetsflöde.

Anpassa kortkommandon

Åtkomst till inställningar för genvägar

För att anpassa dina kortkommandon i VS Code, gå till kommandopaletten genom att trycka på Ctrl + Shift + P och typ Inställningar: Öppna kortkommandon.

Detta öppnar en ny flik där du kan visa och ändra alla tillgängliga genvägar.

Skapa nya genvägar

Att skapa nya genvägar är väldigt enkelt. På fliken genvägar klickar du på pennikonen bredvid kommandot du vill ändra och trycker på tangentkombinationen du vill använda.

Kom ihåg att välja kombinationer som inte står i konflikt med andra viktiga kommandon.

Importera och exportera inställningar

Om du använder VS-kod på olika maskiner kan det vara bra att exportera dina genvägsinställningar. Gå till F1 > Inställningar: Öppna inställningar (JSON) och kopiera önskade inställningar.

För att importera, klistra helt enkelt in dessa inställningar i filen settings.json av den nya maskinen.

Att anpassa dina kortkommandon kan öka din produktivitet avsevärt, vilket gör att du kan arbeta mer effektivt och bekvämt.

Integrering med Git

Konfigurera Git i VS Code

Visual Studio Code har inbyggd integration med versionskontrollsystem som Git.

För att komma igång, öppna panelen "Källkontroll" på vänster sida eller använd kommandona i det nedre statusfältet.

Du kan initiera ett Git-förråd, commit, push och pull, och visa och hantera ändringar direkt i redigeraren.

Initiera ett Git-förråd: Klicka på Git-ikonen i sidofältet och sedan på knappen för startförråd.
Lägg till filer för att begå: Håll muspekaren över de modifierade filerna och klicka på "Stage" för att lägga till dem i commit.
Gör förpliktelsen: Klicka på "Bekräfta steg" för att bekräfta ändringarna.
Tryck till fjärrlager: Använd kommandot git push i den integrerade terminalen eller via det grafiska gränssnittet.

Använder GitLens

GitLens är ett kraftfullt tillägg som förbättrar Git-integrationen i VS Code. Med den kan du se historik för bekräftelse, jämföra ändringar och mer.

För att installera GitLens:

Gå till tilläggsfliken i VS Code.
Sök efter "GitLens" och klicka på installera.
Efter installationen utforskar du de nya funktionerna som är tillgängliga i källkontrollpanelen.

Utföra åtaganden och pushar

För att begå och trycka in VS-kod:

Gör ändringar i koden: Redigera dina filer som vanligt.
Lägg till ändringar i scenen: I källkontrollpanelen klickar du på "Stage All" för att lägga till alla ändringar.
Skriv ett commit-meddelande: Beskriv de ändringar du gjort i meddelandefältet.
Utför commit: Klicka på bockikonen för att bekräfta.
Tryck på ändringar till fjärrförvaret: Använd kommandot git push i den integrerade terminalen eller klicka på tryckknappen i det grafiska gränssnittet.

Att integrera Git med VS Code gör versionskontrollen till en bris, så att du kan hantera din kod effektivt och organiserat, allt på ett ställe.

Använda den integrerade terminalen

Öppnar terminalen

För att öppna den inbyggda terminalen i VS Code, använd genvägen `Ctrl + \

(Windows/Linux) ellerCmd + ` (Mac). Detta öppnar terminalen längst ner i VS-kodfönstret, så att du kan köra kommandon utan att lämna redigeraren.

Navigera och köra kommandon

Den integrerade terminalen fungerar som vilken annan terminal som helst. Du kan navigera mellan kataloger, köra skript, installera paket och mer. Här är några användbara kommandon:

CD för att byta katalog.
ls eller säga för att lista filerna och katalogerna.
npm installera för att installera beroenden för ett Node.js-projekt.
python script.py för att köra ett Python-skript.

Den integrerade terminalen låter dig ha mer kontroll över din utvecklingsmiljö utan att behöva växla mellan olika fönster eller applikationer.

Slutsats

Att ställa in Visual Studio Code för programmering är en givande process eftersom redigeraren erbjuder ett brett utbud av funktionalitet och anpassningsalternativ.

Från installation till konfigurering av teman, tillägg och kortkommandon, varje steg bidrar till en mer produktiv och njutbar arbetsmiljö.

Dra nytta av tipsen och förvandla VS Code till din främsta allierade när du programmerar!