Hvordan installere Angular CLI på Linux


Angular er et populært og svært utvidbart rammeverk for frontend-applikasjonsutvikling med åpen kildekode, brukt til å bygge mobil- og nettapplikasjoner ved å bruke TypeScript/JavaScript og andre vanlige språk. Angular er en paraplybetegnelse for alle Angular-versjoner som kommer etter AngularJS (eller Angular versjon 1.0) inkludert Angular 2 og Angular 4.

Angular er godt egnet for å bygge små og store applikasjoner fra bunnen av. En av nøkkelkomponentene til Angular-plattformen for å hjelpe applikasjonsutvikling er Angular CLI-verktøyet – det er et enkelt og brukervennlig kommandolinjeverktøy som brukes til å lage, administrere, bygge og teste Angular-applikasjoner.

I denne artikkelen vil vi forklare hvordan du installerer Angular kommandolinjeverktøy på et Linux-system og lære noen grunnleggende eksempler på dette verktøyet.

Installerer Node.js i Linux

For å installere Angular CLI, må du ha den nyeste versjonen av Node.js og NPM installert på Linux-systemet.

$ sudo curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash - [for Node.js version 12]
$ sudo curl -sL https://deb.nodesource.com/setup_11.x | sudo -E bash - [for Node.js version 11]
$ sudo curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash - [for Node.js version 10]
$ sudo apt install -y nodejs
# curl -sL https://deb.nodesource.com/setup_12.x | bash - [for Node.js version 12]
# curl -sL https://deb.nodesource.com/setup_11.x | bash - [for Node.js version 11]
# curl -sL https://deb.nodesource.com/setup_10.x | bash - [for Node.js version 10]
# apt install -y nodejs
# curl -sL https://rpm.nodesource.com/setup_12.x | bash - [for Node.js version 12]
# curl -sL https://rpm.nodesource.com/setup_11.x | bash - [for Node.js version 11]
# curl -sL https://rpm.nodesource.com/setup_10.x | bash - [for Node.js version 10]
# yum -y install nodejs
# dnf -y install nodejs [On RHEL 8 and Fedora 22+ versions]

For å kompilere og installere innebygde tillegg fra NPM kan det hende du må installere utviklingsverktøy på systemet ditt som følger.

$ sudo apt install -y build-essential  [On Debian/Ubuntu]
# yum install gcc-c++ make             [On CentOS/RHEL]
# dnf install gcc-c++ make             [On RHEL 8/Fedora 22+]

Installere Angular CLI i Linux

Når du har installert Node.js og NPM, som vist ovenfor, kan du installere Angular CLI ved å bruke npm-pakkebehandlingen som følger (-g-flagget betyr å installere verktøyet i hele systemet som skal brukes av alle systembrukere).

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

Du kan starte Angular CLI ved å bruke den kjørbare ng som nå skal installeres på systemet ditt. Kjør følgende kommando for å sjekke versjonen av Angular CLI installert.

# ng --version

Opprette et Angular-prosjekt ved å bruke Angular CLI

I denne delen vil vi vise hvordan du oppretter, bygger og serverer et nytt, grunnleggende Angular-prosjekt. Gå først inn i webroot-katalogen til serveren din, og initialiser deretter en ny Angular-applikasjon som følger (husk å følge instruksjonene):

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

Gå deretter inn i applikasjonskatalogen som nettopp er opprettet og server applikasjonen som vist.

# cd tecmint-app
# ls 			#list project files
# ng serve

Før du kan få tilgang til den nye appen din fra en nettleser, hvis du har en brannmurtjeneste som kjører, må du åpne port 4200 i brannmurkonfigurasjonen som vist.

---------- On CentOS/RHEL/Fedora ---------- 
# firewall-cmd --permanent --zone=public --add-port=4200/tcp 
# firewall-cmd --reload

---------- On Ubuntu/Debian ----------
$ sudo ufw allow 4200/tcp
$ sudo ufw reload

Nå kan du åpne en nettleser og navigere ved å bruke følgende adresse for å se den nye appen kjøre som vist i følgende skjermbilde.

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

Merk: Hvis du bruker kommandoen ng serve for å bygge en applikasjon og betjene den lokalt, som vist ovenfor, bygger serveren automatisk appen på nytt og laster inn nettsiden(e) på nytt når du endrer noen av kildene filer.

For mer informasjon om ng-verktøyet, kjør følgende kommando.

# ng help

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

I denne artikkelen har vi vist hvordan du installerer Angular CLI på forskjellige Linux-distribusjoner. Vi dekket også hvordan man bygger, kompilerer og serverer en grunnleggende Angular-applikasjon på en utviklingsserver. For spørsmål eller tanker du ønsker å dele med oss, bruk tilbakemeldingsskjemaet nedenfor.