CLI Angular - Come creare un nuovo progetto Angular in Linux
Angular è un framework di sviluppo di applicazioni front-end open source, popolare e altamente estensibile, utilizzato per creare applicazioni web e mobili utilizzando TypeScript/JavaScript e altri linguaggi comuni.
Angular è un termine generico per tutte le versioni Angular successive a AngularJS (o versione Angular 1.0) incluso Angular 2 e Angular 4.
Angular è particolarmente adatto per creare da zero applicazioni su piccola e larga scala. Uno dei componenti chiave della piattaforma Angular per aiutare lo sviluppo di applicazioni è l'utilità Angular CLI: si tratta di uno strumento da riga di comando semplice e facile da usare utilizzato per creare , gestire, creare e testare applicazioni Angular.
In questo articolo spiegheremo come installare lo strumento da riga di comando Angular su un sistema Linux e impareremo alcuni esempi di base di questo strumento.
Installazione di Node.js in Linux
Per installare Angular CLI, devi avere la versione più recente di Node.js e NPM installata sul tuo sistema Linux.
Installa Node.js su Ubuntu
------------- For Node.js v19.x -------------
curl -fsSL https://deb.nodesource.com/setup_19.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v18.x -------------
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v16.x -------------
curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v14.x -------------
curl -fsSL https://deb.nodesource.com/setup_14.x | sudo -E bash - &&\
sudo apt-get install -y nodejs
Installa Node.js su Debian
------------- For Node.js v19.x -------------
curl -fsSL https://deb.nodesource.com/setup_19.x | bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v18.x -------------
curl -fsSL https://deb.nodesource.com/setup_18.x | bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v16.x -------------
curl -fsSL https://deb.nodesource.com/setup_16.x | bash - &&\
sudo apt-get install -y nodejs
------------- For Node.js v14.x -------------
curl -fsSL https://deb.nodesource.com/setup_14.x | bash - &&\
sudo apt-get install -y nodejs
Installa Node.js su RHEL, CentOS, Fedora, Rocky e Alma Linux
------------- For Node.js v19.x -------------
curl -fsSL https://rpm.nodesource.com/setup_19.x | sudo bash -
sudo yum install -y nodejs
------------- For Node.js v18.x -------------
curl -fsSL https://rpm.nodesource.com/setup_18.x | sudo bash -
sudo yum install -y nodejs
------------- For Node.js v16.x -------------
curl -fsSL https://rpm.nodesource.com/setup_16.x | sudo bash -
sudo yum install -y nodejs
------------- For Node.js v14.x -------------
curl -fsSL https://rpm.nodesource.com/setup_14.x | sudo bash -
sudo yum install -y nodejs
Inoltre, per compilare e installare componenti aggiuntivi nativi da NPM potrebbe essere necessario installare gli strumenti di sviluppo sul tuo sistema come segue.
sudo apt install -y build-essential [On Debian/Ubuntu]
sudo yum install gcc-c++ make [On RHEL Systems]
Installazione della CLI angolare in Linux
Dopo aver installato Node.js e NPM, come mostrato sopra, puoi installare Angular CLI utilizzando il gestore pacchetti npm come segue (il flag -g significa installare lo strumento a livello di sistema affinché possa essere utilizzato da tutti gli utenti del sistema).
npm install -g @angular/cli
OR
sudo npm install -g @angular/cli
Puoi avviare la CLI Angular utilizzando l'eseguibile ng che ora dovrebbe essere installato sul tuo sistema. Esegui il comando seguente per verificare la versione di Angular CLI installata.
ng version
OR
ng --version
Creazione di un progetto Angular utilizzando la CLI Angular
In questa sezione mostreremo come creare, costruire e servire un nuovo progetto Angular di base. Innanzitutto, spostati nella directory webroot del tuo server, quindi inizializza una nuova applicazione Angular come segue (ricordati di seguire le istruzioni):
cd /var/www/html/
ng new tecmint-app #as root
OR
sudo ng new tecmint-app #non-root user
Successivamente, spostati nella directory dell'applicazione appena creata e servi l'applicazione come mostrato.
cd tecmint-app
ls #list project files
ng serve
Prima di poter accedere alla tua nuova app da un browser web, se hai un servizio firewall in esecuzione, devi aprire la porta 4200 nella configurazione del firewall come mostrato.
---------- On Firewalld ----------
firewall-cmd --permanent --zone=public --add-port=4200/tcp
firewall-cmd --reload
---------- On UFW ----------
sudo ufw allow 4200/tcp
sudo ufw reload
Ora puoi aprire un browser Web e navigare utilizzando il seguente indirizzo per vedere la nuova app eseguita come mostrato nello screenshot seguente.
http://localhost:4200/
or
http://SERVER_IP:4200
Nota: se utilizzi il comando ng serve per creare un'applicazione e servirla localmente, come mostrato sopra, il server ricostruisce automaticamente l'app e ricarica le pagine web quando modifichi uno qualsiasi dei file sorgente.
Per ulteriori informazioni sullo strumento ng, esegui il comando seguente.
ng help
La home page della CLI di Angular: https://angular.io/cli
In questo articolo, abbiamo mostrato come installare Angular CLI su diverse distribuzioni Linux. Abbiamo anche spiegato come creare, compilare e servire un'applicazione Angular di base su un server di sviluppo. Per qualsiasi domanda o pensiero che desideri condividere con noi, utilizza il modulo di feedback qui sotto.