Angular CLI - Kuinka luoda uusi kulmaprojekti Linuxissa


Angular on avoimen lähdekoodin, suosittu ja erittäin laajennettava käyttöliittymäsovelluskehityskehys, jota käytetään mobiili- ja verkkosovellusten rakentamiseen TypeScriptin/JavaScriptin avulla. vahva> ja muita yleisiä kieliä.

Angular on kattotermi kaikille Angular-versioille, jotka tulevat AngularJS:n (tai Angular version 1.0) jälkeen, mukaan lukien Angular 2. ja Angular 4.

Angular sopii hyvin pienten ja suurten sovellusten rakentamiseen alusta alkaen. Yksi Angular -alustan avainkomponenteista sovelluskehityksen avuksi on Angular CLI -apuohjelma – se on yksinkertainen ja helppokäyttöinen komentorivityökalu, jota käytetään luomiseen. , hallita, rakentaa ja testata Angular-sovelluksia.

Tässä artikkelissa selitämme, kuinka Angular-komentorivityökalu asennetaan Linux-järjestelmään, ja opimme perusesimerkkejä tästä työkalusta.

Node.js:n asentaminen Linuxiin

Jotta voit asentaa Angular CLI:n, sinulla on oltava uusin Node.js- ja NPM-versio asennettuna Linux-järjestelmääsi.

Asenna Node.js Ubuntuun

------------- 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

Asenna Node.js Debianiin

------------- 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

Asenna Node.js RHEL-, CentOS-, Fedora-, Rocky- ja Alma Linuxiin

------------- 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

Lisäksi sinun on ehkä asennettava kehitystyökaluja järjestelmääsi, jotta voit kääntää ja asentaa natiivilaajennuksia NPM:stä.

sudo apt install -y build-essential  [On Debian/Ubuntu]
sudo yum install gcc-c++ make        [On RHEL Systems]

Angular CLI:n asentaminen Linuxiin

Kun Node.js ja NPM on asennettu yllä olevan kuvan mukaisesti, voit asentaa Angular CLI:n npm-paketinhallinnan avulla. seuraavasti (-g-lippu tarkoittaa työkalun asentamista koko järjestelmään kaikkien järjestelmän käyttäjien käytettäväksi).

npm install -g @angular/cli
OR
sudo npm install -g @angular/cli

Voit käynnistää Angular CLI:n käyttämällä ng-suoritettavaa tiedostoa, jonka pitäisi nyt olla asennettuna järjestelmääsi. Suorita seuraava komento tarkistaaksesi asennetun Angular CLI:n version.

ng version
OR
ng --version

Kulmaprojektin luominen Angular CLI:n avulla

Tässä osiossa näytämme, kuinka luodaan, rakennetaan ja palvellaan uusi peruskulmaprojekti. Siirry ensin palvelimesi webroot-hakemistoon ja alusta sitten uusi Angular-sovellus seuraavasti (muista noudattaa ohjeita):

cd /var/www/html/
ng new tecmint-app			#as root
OR
sudo ng new tecmint-app		#non-root user

Siirry seuraavaksi juuri luotuun sovellushakemistoon ja palvele sovellusta kuvan mukaisesti.

cd tecmint-app
ls 			#list project files
ng serve

Jos sinulla on palomuuripalvelu käynnissä, ennen kuin voit käyttää uutta sovellustasi verkkoselaimella, sinun on avattava portti 4200 palomuurikokoonpanossa kuvan osoittamalla tavalla.

---------- On Firewalld ---------- 
firewall-cmd --permanent --zone=public --add-port=4200/tcp 
firewall-cmd --reload

---------- On UFW ----------
sudo ufw allow 4200/tcp
sudo ufw reload

Nyt voit avata verkkoselaimen ja navigoida seuraavan osoitteen avulla nähdäksesi, että uusi sovellus toimii seuraavan kuvakaappauksen mukaisesti.

http://localhost:4200/ 
or 
http://SERVER_IP:4200 

Huomaa: jos käytät komentoa ng serve rakentaaksesi sovelluksen ja palvellaksesi sitä paikallisesti, kuten yllä näkyy, palvelin rakentaa sovelluksen automaattisesti uudelleen ja lataa verkkosivut uudelleen, kun muutat lähdetiedostoja.

Saat lisätietoja ng-työkalusta suorittamalla seuraavan komennon.

ng help

Angular CLI -kotisivu: https://angular.io/cli

Tässä artikkelissa olemme osoittaneet, kuinka Angular CLI asennetaan erilaisiin Linux-jakeluihin. Käsittelimme myös Angular-perussovelluksen rakentamista, kääntämistä ja palvelemista kehityspalvelimella. Jos sinulla on kysyttävää tai ajatuksia, jotka haluat jakaa kanssamme, käytä alla olevaa palautelomaketta.