Panoramica dell'IDE di Visual Studio per JavaScript

In questa introduzione di 5-10 minuti all'ambiente di sviluppo integrato (IDE) di Visual Studio viene fornita una panoramica di alcune finestre, menu e altre funzionalità dell'interfaccia utente.

Se Visual Studio non è stato installato, passare alla pagina dei download di Visual Studio per installarlo gratuitamente.

Finestra iniziale

La prima cosa che viene visualizzata dopo l'avvio di Visual Studio è la finestra iniziale. La finestra iniziale è progettata per aiutarti ad "arrivare al codice" più velocemente. Dispone di opzioni per chiudere o archiviare il codice, aprire un progetto o una soluzione esistente, creare un nuovo progetto o semplicemente aprire una cartella contenente alcuni file di codice. Se la finestra iniziale non è aperta, scegliere Finestra di avvio file > per aprirla.

Se questa è la prima volta che si usa Visual Studio, l'elenco di progetti recenti sarà vuoto.

Se si usano codebase non basate su MSBuild, usare l'opzione Apri una cartella locale per aprire il codice in Visual Studio. Per altre informazioni, vedere Sviluppare codice in Visual Studio senza progetti o soluzioni. In caso contrario, è possibile creare un nuovo progetto o clonare un progetto da un provider di origine, ad esempio GitHub o Azure DevOps.

L'opzione Continua senza codice apre semplicemente l'ambiente di sviluppo di Visual Studio senza alcun progetto o codice specifico caricato. È possibile scegliere questa opzione per partecipare a una sessione di Live Share o collegarsi a un processo per il debug. È anche possibile premere ESC per chiudere la finestra iniziale e aprire l'IDE.

Creare un progetto

Per continuare a esplorare le funzionalità di Visual Studio, creare un nuovo progetto.

1. Nella finestra iniziale selezionare Crea un nuovo progetto e quindi nella casella di ricerca digitare javascript o typescript per filtrare l'elenco dei tipi di progetto in base a quelli che contengono "javascript" o "typescript" nel nome o nel tipo di linguaggio.

   Visual Studio offre vari tipi di modelli di progetto che consentono di iniziare rapidamente a scrivere codice.

   

2. Scegliere un modello di progetto Applicazione Express JavaScript e fare clic su Avanti.

3. Nella finestra di dialogo Configura il nuovo progetto visualizzata accettare il nome del progetto predefinito e scegliere Crea.

   Il progetto è stato creato. Nel riquadro di destra selezionare app.js per aprire il file nella finestra Editor . L'editor mostra il contenuto dei file ed è la posizione in cui si esegue la maggior parte del lavoro di scrittura del codice in Visual Studio.

   

Esplora soluzioni

Esplora soluzioni, che in genere si trova sul lato destro di Visual Studio, mostra una rappresentazione grafica della gerarchia di file e cartelle nel progetto, nella soluzione o nella cartella del codice. È possibile esplorare la gerarchia e passare a un file in Esplora soluzioni.

Menu

La barra dei menu nella parte superiore dei comandi di Visual Studio raggruppa i comandi in categorie. Ad esempio, il menu Progetto contiene comandi correlati al progetto in uso. Nel menu Strumenti è possibile personalizzare il comportamento di Visual Studio selezionando Opzioni o aggiungendo funzionalità all'installazione selezionando Ottieni strumenti e funzionalità.

Aprire la finestra Elenco errori scegliendo il menu Visualizza e quindi Elenco errori.

Elenco errori

L'elenco errori mostra errori, avvisi e messaggi relativi allo stato corrente del codice. Se sono presenti errori (ad esempio una parentesi graffa o un punto e virgola mancante) nel file o in qualsiasi punto del progetto, vengono elencati qui.

Finestra di output

La finestra Output mostra i messaggi di output dalla compilazione del tuo progetto e dal provider di controllo del codice sorgente.

Costruiamo il progetto per vedere un output di compilazione. Scegliere Compila soluzione dal menu Compila. La finestra Output si attiva automaticamente e visualizza un messaggio di compilazione riuscita.

Casella di ricerca

La casella di ricerca è un modo semplice e rapido per eseguire praticamente qualsiasi operazione in Visual Studio. È possibile immettere un testo correlato a ciò che si vuole fare e verrà visualizzato un elenco di opzioni relative al testo. Si supponga, ad esempio, di voler aumentare la verbosità dell'output di compilazione per visualizzare dettagli aggiuntivi su ciò che esattamente il processo di compilazione sta facendo. Ecco come eseguire questa operazione:

1. Se la casella Cerca non viene visualizzata, premere CTRL+Q per aprirla e quindi digitare verbosity nella casella.

2. Nei risultati visualizzati fare doppio clic sulla voce verbosity dell'output di compilazione del progetto MSBuild (projectsAndSolutions.buildAndRun.outputVerbosity).

   

   Il riquadro Opzioni viene aperto nella sezione Tutte le impostazioni>progetti e soluzioni>Compilazione ed esecuzione .

3. Usare l'elenco a discesa e impostare l'opzione dettaglio output compilazione progetto MSBuild su Normale.

4. Compilare di nuovo il progetto facendo clic con il pulsante destro del mouse sul progetto in Esplora soluzioni e scegliendo Ricompila dal menu di scelta rapida.

   Questa volta la finestra Output mostra una registrazione più dettagliata dal processo di compilazione.

   

Menu Invia commenti e suggerimenti

In caso di problemi durante l'uso di Visual Studio o se si hanno suggerimenti su come migliorare il prodotto, è possibile usare il menu Invia commenti e suggerimenti nella parte superiore della finestra di Visual Studio.

Passaggi successivi

Sono stati esaminati solo alcune delle funzionalità di Visual Studio per acquisire familiarità con l'interfaccia utente. Per approfondire:

Informazioni sull'editor di codice

Informazioni su progetti e soluzioni

Vedere anche

• Panoramica dell'IDE di Visual Studio
• Altre funzionalità di Visual Studio 2017
• Modificare i colori del tema e del carattere