Översikt över Visual Studio IDE för JavaScript

I den här 5–10-minuters introduktionen till Visual Studio Integrated Development Environment (IDE) tar vi en rundtur i några av fönstren, menyerna och andra gränssnittsfunktioner.

Om du inte har installerat Visual Studio går du till nedladdningssidan för Visual Studio för att installera det kostnadsfritt.

Startfönster

Det första du ser när du har startat Visual Studio är startfönstret. Startfönstret är utformat för att hjälpa dig att "komma åt kod" snabbare. Den har alternativ för att stänga eller checka ut kod, öppna ett befintligt projekt eller en befintlig lösning, skapa ett nytt projekt eller helt enkelt öppna en mapp som innehåller vissa kodfiler. Om startfönstret inte är öppet väljer du Startfönster för fil > för att öppna det.

Om det här är första gången du använder Visual Studio är din senaste projektlista tom.

Om du arbetar med icke-MSBuild-baserade kodbaser använder du alternativet Öppna en lokal mapp för att öppna koden i Visual Studio. Mer information finns i Utveckla kod i Visual Studio utan projekt eller lösningar. Annars kan du skapa ett nytt projekt eller klona ett projekt från en källprovider, till exempel GitHub eller Azure DevOps.

Alternativet Fortsätt utan kod öppnar helt enkelt Visual Studio-utvecklingsmiljön utan att något specifikt projekt eller kod läses in. Du kan välja det här alternativet för att ansluta till en Live Share-session eller ansluta till en process för felsökning. Du kan också trycka på Esc för att stänga startfönstret och öppna IDE:t.

Skapa ett projekt

Om du vill fortsätta utforska Visual Studio-funktionerna ska vi skapa ett nytt projekt.

1. I startfönstret väljer du Skapa ett nytt projekt och skriver i sökrutan javascript eller typescript för att filtrera listan över projekttyper till dem som innehåller "javascript" eller "typescript" i deras namn eller språktyp.

   Visual Studio innehåller olika typer av projektmallar som hjälper dig att komma igång med kodning snabbt.

   

   

3. I dialogrutan Konfigurera det nya projektet som visas godkänner du standardprojektets namn och väljer Skapa.

   Projektet har skapats. I den högra rutan väljer du app.js för att öppna filen i redigeringsfönstret . Redigeraren visar innehållet i filer och det är där du gör det mesta av ditt kodningsarbete i Visual Studio.

   

   Projektet skapas och en fil med namnet server.js öppnas i redigeringsfönstret . Redigeraren visar innehållet i filer och det är där du gör det mesta av ditt kodningsarbete i Visual Studio.

   

Solution Explorer

Solution Explorer, som vanligtvis finns till höger i Visual Studio, visar en grafisk representation av hierarkin med filer och mappar i din projekt-, lösnings- eller kodmapp. Du kan bläddra i hierarkin och navigera till en fil i Solution Explorer.

Menyer

Menyraden längst upp i Visual Studio grupperar kommandon i kategorier. Projektmenyn innehåller till exempel kommandon som är relaterade till det projekt som du arbetar i. På menyn Verktyg kan du anpassa hur Visual Studio fungerar genom att välja Alternativ eller lägga till funktioner i installationen genom att välja Hämta verktyg och funktioner.

Nu öppnar vi fönstret Fellista genom att välja menyn Visa och sedan Fellista.

Fellista

I fellistan visas fel, varningar och meddelanden om kodens aktuella tillstånd. Om det finns några fel (till exempel en klammerparentes eller semikolon) i filen, eller var som helst i projektet, visas de här.

Resultatfönster

Fönstret Utdata visar utdatameddelanden från att bygga ditt projekt och från din källkodshanterare.

Nu ska vi bygga projektet för att se några byggutdata. På menyn Skapa väljer du Skapa lösning. Fönstret Utdata hämtar automatiskt fokus och visar ett lyckat byggmeddelande.

Sökruta

Sökrutan är ett snabbt och enkelt sätt att göra i stort sett vad som helst i Visual Studio. Du kan ange text som är relaterad till det du vill göra, så visas en lista med alternativ som hör till texten. Anta till exempel att du vill öka versionsutdatans utförlighet för att visa ytterligare information om exakt vad bygget gör. Så här kan du göra så här:

1. Om du inte ser sökrutan trycker du på Ctrl + Q för att öppna den.

2. Skriv verbosity i sökrutan. Från de visade resultaten väljer du Projekt och lösningar –> Skapa och kör.

   

   

   Dialogrutan Alternativ öppnas på sidan Skapa och kör alternativ.

3. Under MSBuild-projektets byggutdata-verbositet väljer du Normal och klickar sedan på OK.

4. Skapa projektet igen genom att högerklicka på projektet i Solution Explorer och välja Återskapa från snabbmenyn.

   Den här gången visar utdatafönstret mer utförlig loggning från byggprocessen.

   

   

Menyn Skicka feedback

Om du stöter på problem när du använder Visual Studio, eller om du har förslag på hur du kan förbättra produkten, kan du använda menyn Skicka feedback överst i Visual Studio-fönstret.

Nästa steg

Vi har tittat på några av funktionerna i Visual Studio för att bekanta oss med användargränssnittet. Så här utforskar du vidare:

Se även

• Översikt över Visual Studio IDE
• Fler funktioner i Visual Studio 2017
• Ändra tema- och teckensnittsfärger