Sådan installeres Angular CLI på Linux


Angular er en open source, populær og meget udvidelig front-end applikationsudviklingsramme, der bruges til at opbygge mobil- og webapplikationer ved hjælp af TypeScript/JavaScript og andre almindelige sprog. Angular er et paraplyudtryk for alle Angular versioner, der kommer efter AngularJS (eller Angular version 1.0) inklusive Angular 2 og Angular 4.

Angular er velegnet til opbygning af små til store applikationer fra bunden. En af nøglekomponenterne i Angular-platformen til at understøtte applikationsudvikling er Angular CLI-værktøjet - det er et simpelt og brugervenligt kommandolinjeværktøj, der bruges til at oprette, administrere, opbygge og teste kantede applikationer.

I denne artikel vil vi forklare, hvordan du installerer Angular kommandolinjeværktøj på et Linux-system og lære nogle grundlæggende eksempler på dette værktøj.

Installation af Node.js i Linux

For at installere Angular CLI skal du have den nyeste version af Node.js og NPM installeret på dit Linux-system.

$ 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 at kompilere og installere native add-ons fra NPM skal du muligvis installere udviklingsværktøjer på dit system 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+]

Installation af kantet CLI i Linux

Når du har installeret Node.js og NPM, som vist ovenfor, kan du installere Angular CLI ved hjælp af npm-pakkehåndteringen som følger ( -g -flaget betyder at installere værktøjet hele systemet, der skal bruges af alle systembrugere).

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

Du kan starte Angular CLI ved hjælp af ng eksekverbar, som nu skal installeres på dit system. Kør følgende kommando for at kontrollere versionen af Angular CLI installeret.

# ng --version

Oprettelse af et kantet projekt ved hjælp af kantet CLI

I dette afsnit viser vi, hvordan man opretter, bygger og serverer et nyt, grundlæggende Angular-projekt. Først skal du gå ind i webroot-biblioteket på din server og derefter initialisere en ny Angular-applikation som følger (husk at følge vejledningen):

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

Gå derefter ind i applikationsmappen, der lige er oprettet, og tjen applikationen som vist.

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

Inden du kan få adgang til din nye app fra en webbrowser, skal du åbne port 4200 i firewallkonfigurationen som vist, hvis du kører en firewall-tjeneste.

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

Nu kan du åbne en webbrowser og navigere ved hjælp af følgende adresse for at se den nye app køre som vist i det følgende skærmbillede.

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

Bemærk: Hvis du bruger kommandoen ng serve til at opbygge en applikation og servere den lokalt, som vist ovenfor, genopbygger serveren automatisk appen og genindlæser websiden (e), når du ændrer nogen af kilden filer.

For at få flere oplysninger om ng-værktøjet, kør følgende kommando.

# ng help

Den kantede CLI-hjemmeside: https://angular.io/cli

I denne artikel har vi vist, hvordan du installerer Angular CLI på forskellige Linux-distributioner. Vi dækkede også, hvordan man bygger, kompilerer og serverer en grundlæggende Angular-applikation på en udviklingsserver. For eventuelle spørgsmål eller tanker, du vil dele med os, skal du bruge feedbackformularen nedenfor.