Så här anpassar du Visual Studio Code

Visual Studio Code, Microsofts nya open source-kodredaktör ger utvecklare många fantastiska funktioner som markant underlätta processen med källkod redigering. Dessutom säkerställer Visual Studio Code att användarna inte kommer att bli uttråkad när de arbetar med det, vilket det tillåter dem att anpassa flera delar av sitt utseende, som färger, teckensnitt, mellanslag och textformatering, precis som många funktioner, t.ex. luddning och validaton regler.

I det här inlägget ska vi först titta på hur man ändrar utseendet på Visual Studio Kod-arbetsytan, då ska jag visa dig hur du anpassar standardinställningarna med hjälp av två JSON-formaterade konfigurationsfiler.

Så här ställer du in en färgtema på VS-koden

Visual Studio Code tillåter dig att Ange ett anpassat färgtema för din redaktör.

För att lägga in ett färdigt tema, klicka på Arkiv> Inställningar> Färgtema menyn i översta menyraden. När du träffar “Stiga på”, Kommandopaletten dyker upp och visar en rullgardinslista över de teman du kan välja mellan.

Du kan uppnå samma effekt om du trycker på F1 för att öppna kommandopalen och skriv in Inställningar: Färgtema kommandot i inmatningsfältet.

När du rullar över alternativen i listrutan, Arbetsytans utseende ändras i realtid, så du kan snabbt se vilket tema som passar dina behov bäst.

Jag chooe the “Hög kontrast” färgtema, eftersom mina ögon inte är bäst. Här ser min syn ut.

Så här installerar du ett tema från VS Code Marketplace

Om du inte gillar någon av de färgtema som VS Code erbjuder som standard kan du ladda ner många andra från VS-kodmarknaden.

Här kan du se vilka teman marknadsplatsen för närvarande har. Om du vill installera ett tema från Marketplace klickar du på F1 precis inuti din VS-kodredigerare för att öppna kommandopalen och skriv sedan in ext installera kommandot i inmatningsfältet, slutligen välja Extensions: Install Extension alternativet från listan som dyker upp.

När du klickar på det här alternativet visas en ny instans av Command Palette. Skriv "ext installera tema" kommandot till det nya inmatningsfältet, och du kommer att få en lista över alla teman som är tillgängliga från VS-kodmarknaden.

Jag väljer det tema som heter “Material Tema Kit”, och installera den genom att klicka på den. För att få det nya temat i listan Färgtema, på samma plats där de andra standardteman är, behöver du starta om VS-koden. Efter omstart visas det nya temat i temarlistan, och du kan ställa in det från kommandopalen.

Med det nya materialet ser min redaktör ut så här:

Du kan gå tillbaka till föregående tema (som jag gjorde, för att jag fortfarande föredrar det temat) eller du kan spela lite mer med andra teman för att se vilken som passar dig.

Om du vill kan du också skapa ditt eget tema, och publicera den på VS Code Marketplace genom att använda verktyget vsce extension manager.

Ändra inställningar för användar- och arbetsyta

VS-koden låter dig inte bara ange ett anpassat tema, men du kan också konfigurera många andra inställningar, som formateringsregler, användning av olika funktioner, kraschrapporter, HTTP-inställningar, filföreningar, lintingregler och mer.

Du kan göra detta genom att redigera två konfigurationsfiler, både i JSON-format. Oroa dig inte, du behöver inte vara ett proffs, eftersom VS-koden erbjuder ett ganska enkelt och intuitivt sätt att snabbt lägga till dina anpassningar.

Låt oss först se vad som är skillnaden mellan de två konfigurationsfilerna. VS-koden har två omfång (global och lokal) för inställningar, följaktligen de två separata filerna:

1. den globala settings.json, där konfigurationsreglerna gäller för varje arbetsyta
2. arbetsområdet relaterat .vscode / settings.json, det är bara relaterat till en enskild arbetsyta

De global settings.json filen finns i mappen där ditt operativsystem lagrar alla andra apprelaterade konfigurationsfiler:

• på Windows: % APPDATA% \ kod \ Användare \ settings.json
• på Linux: $ HOME / .config / Kod / Användare / settings.json
• på Mac: $ HOME / Library / Application Support / Kod / Användare / settings.json

De arbetsyta relaterad settings.json filen lagras i mappen för ditt aktuella projekt. Som standard finns den här filen inte, men så snart du lägger till en anpassad arbetsplatsinställning skapar VS-koden en .vscode / settings.json filen samtidigt, och lägger in anpassade arbetsområdesspecifika konfigurationer i den.

Så när använder du settings.json filer?

Om du vill att VS-kod ska använda dina anpassade konfigurationsregler i Allt dina projekt, sätta dem i global settings.json fil.

Om du vill att dina inställningar bara ska vara giltiga i din nuvarande projekt, placera dem i arbetsytan settings.json fil.

Inställningar för arbetsyta åsidosätter de globala inställningarna, så var försiktig.

Globala inställningar heter “Användarinställningar” i VS-kod. Öppna dem antingen genom att klicka på Arkiv> Inställningar> Användarinställningar menyn, eller genom att börja skriva in uttrycket “Användarinställningar” in i kommandopalen (öppna den med F1).

VS-kod öppnar två rutor bredvid varandra: den vänstra innehåller alla alternativ som är möjliga att konfigurera, och den rätta visar globalt settings.json fil. Du måste placera dina anpassade konfigurationsregler i den här filen.

Som du kan se behöver du inte göra något annat, kopiera bara de inställningar du vill ändra från vänster till höger och lägg till de modifierade värdena.

Låt oss ta en titt på ett kort exempel (men du kan göra andra ändringar enligt dina individuella behov). Jag kommer att ändra typsnittet, minska längden på a flik från standard fyra platser till två, minska det maximala antalet arbetsfiler från nio till fem och ändra en av CSS-bindningsreglerna för dubbla format från "ignorera" till "varning".

Efter kopiering, min globala settings.json filen ser så här ut:

 // Placera dina inställningar i den här filen för att skriva över standardinställningarna "editor.fontFamily": "Courier New", "editor.tabSize": 2, "explorer.workingFiles.maxVisible": 5, "css.lint.duplicateProperties" : "varning"

Efter att ha sparat den modifierade settings.json fil, ser min redaktörs utseende på en gång ut (på skärmdumpen nedan är endast ändringen av typsnittet synlig):

Du kan ändra arbetsytans inställningar på samma sätt. Nu måste du klicka på Arkiv> Inställningar> Inställningar för arbetsytor i den övre menyraden för att komma åt arbetsområdet .vscode / settings.json fil.

Inställningar för arbetsytor har exakt samma konfigurationsalternativ som Användarinställningar, och du kan använda samma kopieringsteknik. Det finns bara två skillnader, omfattningen (lokal istället för global) och settings.json fil där dina anpassade konfigurationer sparas.