Nota
L'accesso a questa pagina richiede l'autorizzazione. È possibile provare ad accedere o modificare le directory.
L'accesso a questa pagina richiede l'autorizzazione. È possibile provare a modificare le directory.
In questa guida introduttiva si crea ed esegue un'applicazione Web front-end di base Vue.js. Questo articolo offre un'introduzione di 5-10 minuti all'IDE (Integrated Development Environment) di Visual Studio.
Prerequisiti
Preparare la configurazione con i prerequisiti seguenti:
Visual Studio 2022 o versione successiva (scarica la versione gratuita Visual Studio downloads
npm (incluso con Node.js, https://www.npmjs.com/)
Vue.js (Installazione | Vue.js (vuejs.org))
Creare l'app Vue
Creare un'app Web Vue.js seguendo questa procedura:
Nella finestra Visual Studio Start (selezionare File>Start Window), selezionare Crea un nuovo progetto.
Nella finestra di dialogo Crea un nuovo progetto immettere Vue nella casella di ricerca. Selezionare il modello di app Vue per JavaScript o TypeScript e selezionare Avanti.
In Visual Studio 2022 versione 11 e successive, il nome del modello Standalone JavaScript Vue Project viene modificato in Vue App.
Immettere un nome per il progetto e la soluzione e selezionare Crea.
Attendere che Visual Studio crei il nuovo progetto.
Visualizzare le proprietà del progetto
Le impostazioni predefinite del progetto consentono di compilare ed eseguire il debug del progetto.
Per modificare le impostazioni, seguire questa procedura:
Fare clic con il pulsante destro del mouse sul progetto in Esplora soluzioni e selezionare Proprietà.
Nel riquadro delle proprietà del progetto selezionare Debug, Linting, Build o Deploy per visualizzare le proprietà corrispondenti.
Per la configurazione del debugger, usare il file launch.json .
Nota
Il launch.json file di configurazione del debugger archivia le impostazioni di avvio associate all'azione Avvia sulla barra degli strumenti Debug. Il launch.json file deve trovarsi nella .vscode cartella del progetto.
Compilare il progetto
Per compilare il nuovo progetto, selezionare Compila>soluzione di compilazione.
Avviare il progetto
Selezionare F5 o usare l'azione Avvia nella parte superiore della finestra.
Il progetto apre un prompt dei comandi con il testo seguente (o simile):
VITE v4.4.9 ready in 780 ms
Nota
Controlla l'output della console per eventuali messaggi, come le istruzioni per aggiornare Node.js.
Quando il processo ha esito positivo, viene aperta l'app di base Vue.js.