Come impostare Angular in VS Code [Guida]

Angular è un framework di applicazioni web open source che utilizza JavaScript. A differenza di altri framework o linguaggi di programmazione, è necessario impostare la variabile di ambiente in Windows affinché questo framework funzioni. Dobbiamo quindi imparare a farloimpostare Angular in VS Codee scrivere un codice demo, ecco cosa faremo.

Per configurare Angular in VS Code sul tuo computer Windows, devi seguire i passaggi indicati di seguito.

1. Installa il codice di Visual Studio
2. Configura NodeJS
3. Imposta la variabile d'ambiente
4. Installa Angular

Parliamo di loro in dettaglio.

1] Installa il codice di Visual Studio

Per iniziare il nostro viaggio nella codifica nel regno Angular, dobbiamo installare Visual Studio Code. Per fare lo stesso, devi andare acode.visualstudio.come scarica l'app per il tuo ambiente. Una volta scaricato, vai suScaricamentocartella, eseguire il supporto di installazione e installare l'applicazione.

2] Configura NodeJS

È importante notare che sebbene sia possibile utilizzare VSCode per modificare Angular, non è possibile eseguirlo direttamente nell'editor. Angular viene effettivamente eseguito all'interno di NodeJS, che è un ambiente JavaScript che fa parte della configurazione di sviluppo web locale. Con NodeJS, puoi eseguire Angular sul tuo host locale in un browser web. Ogni volta che apporti modifiche al tuo codice Angular in VSCode, questo verrà ricaricato automaticamente nel browser, operazione nota come "ricaricamento a caldo". Tuttavia, poiché Angular viene eseguito in NodeJS, dovrai prima installare NodeJS. Puoi farlo andando anodejs.org.

Quando installi Node JS per eseguire Angular, scegli una posizione facile da ricordare, come un percorso semplice e breve. Ciò sarà utile se avrai bisogno di utilizzare NodeJS in un secondo momento. Quindi, invece di installare l'app nei file di programma, installala in D:\NodeJS, anche se non importa.

3] Imposta la variabile d'ambiente

Successivamente, dobbiamo impostare la variabile di ambiente per NodeJs prima di procedere e installare Angular. Per fare lo stesso, segui questi passaggi.

• Premi Win + S, digita“Variabile ambientale”e poi aprirlo.
• Una volta terminato, devi copiare la posizione di NodeJS. Solo per riferimento, il nostro è D:\NodeJS.
• Fare clic su Variabile d'ambiente.
• Ora seleziona Percorso nella sezione Variabile di sistema e fai clic su Modifica.
• Fare clic su Nuovo, incollare la posizione e fare clic su Ok.

In questo modo, hai inserito la variabile d'ambiente NodeJS. Per verificare se funziona, apriPrompt dei comandie poi corrinodo –versione.Se ti fornisce una versione, possiamo installare Angular.

4] Installa Angular

Dopo aver creato un ambiente adeguato installando NodeJS, installeremo Angular. Segui i passaggi indicati di seguito per fare lo stesso.

• AprireCodice di Visual Studio.
• Passare alla posizione in cui si desidera creare un file Angular utilizzando il comando CD o Cambia directory. Abbiamo creato una nuova directory nell'unità D per creare un progetto, controlla lo screenshot allegato.

• Per installare angolare nella cartella, dobbiamo eseguire il seguente comando.

  npm install -g @angular/cli

• Quindi esegui il comando seguente per creare un nuovo progetto.

  ng new foldername

• Ora entra in quella cartella usando "nomecartella cd" e avvia il server usandodi servire.

Si spera che ora tu possa eseguire Angular senza problemi.

Leggere:?

Questo comando non è disponibile quando si esegue la CLI Angular all'esterno di uno spazio di lavoro

Quando ho eseguito il comando "ng serve" ho ricevuto un errore che diceva che il comando non era disponibile. Molte persone sospettano che Angular non sia installato sul proprio sistema, mentre in realtà l'unico problema è che non sei nella directory corretta. Per risolverlo, basta eseguire "cd" nella directory in cui si trova il progetto, non nella posizione root ma nella posizione effettiva del progetto. Quindi, all'inizio, quando ho eseguito il comando, ero in AngularProject, che è la mia cartella principale, quindi non ha funzionato. Tuttavia, ha funzionato perfettamente quando ho cambiato la directory in sampleFolder ed ho eseguito lo stesso comando.

Una soluzione alternativa che ti consigliamo di fare è aprire Esplora file, andare nella posizione in cui è archiviato il progetto, fare clic con il pulsante destro del mouse sullo schermo vuoto e selezionareTerminale > Prompt dei comandi. E poi corridi servire.

Leggere:?

Come impostare il progetto Angular in Visual Studio Code?

Per configurare un progetto Angular, devi prima installare NodeJS sul tuo computer. Una volta terminato, è necessario configurare la variabile d'ambiente e installare Angular utilizzando il filenpm install -g @angular/cli comando. Ora vai avanti e crea una nuova directory utilizzandong new foldername comando, per saperne di più, controlla i passaggi menzionati in precedenza.

Leggere:

Come generare VSCode angolare?

Angular File Generator è una pratica estensione per Visual Studio Code che ti consente di creare file Angular con pochi clic. È basato sulla CLI Angular e utilizza gli stessi schemi della CLI. Inoltre, fornisce un'opzione per generare file direttamente dal terminale.

Leggi anche:.