Angular CLI - Een nieuw Angular-project maken in Linux
Angular is een open-source, populair en uiterst uitbreidbaar front-end applicatie-ontwikkelingsframework, dat wordt gebruikt voor het bouwen van mobiele en webapplicaties met behulp van TypeScript/JavaScript en andere veel voorkomende talen.
Angular is een overkoepelende term voor alle Angular versies die komen na AngularJS (of Angular versie 1.0), inclusief Angular 2 , en Hoek 4.
Angular is zeer geschikt voor het helemaal opnieuw bouwen van kleine tot grootschalige applicaties. Een van de belangrijkste componenten van het Angular platform om de ontwikkeling van applicaties te ondersteunen is het hulpprogramma Angular CLI. Dit is een eenvoudig en gemakkelijk te gebruiken opdrachtregelprogramma dat wordt gebruikt om , beheer, bouw en test Angular-applicaties.
In dit artikel leggen we uit hoe je het Angular opdrachtregelprogramma op een Linux-systeem installeert en leren we enkele basisvoorbeelden van dit hulpprogramma.
Node.js installeren onder Linux
Om Angular CLI te installeren, moet de nieuwste versie van Node.js en NPM op uw Linux-systeem zijn geïnstalleerd.
Installeer Node.js op 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
Installeer Node.js op 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
Installeer Node.js op RHEL, CentOS, Fedora, Rocky en 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
Om native add-ons van NPM te compileren en te installeren, moet u mogelijk ook de ontwikkeltools als volgt op uw systeem installeren.
sudo apt install -y build-essential [On Debian/Ubuntu]
sudo yum install gcc-c++ make [On RHEL Systems]
Angular CLI installeren onder Linux
Zodra Node.js en NPM zijn geïnstalleerd, zoals hierboven weergegeven, kunt u Angular CLI installeren met behulp van de npm pakketbeheerder als volgt (de vlag -g betekent dat de tool systeembreed wordt geïnstalleerd zodat deze door alle systeemgebruikers kan worden gebruikt).
npm install -g @angular/cli
OR
sudo npm install -g @angular/cli
U kunt de Angular CLI starten met behulp van het uitvoerbare bestand ng dat nu op uw systeem zou moeten zijn geïnstalleerd. Voer de volgende opdracht uit om te controleren welke versie van Angular CLI is geïnstalleerd.
ng version
OR
ng --version
Een Angular-project maken met behulp van Angular CLI
In dit gedeelte laten we zien hoe u een nieuw, eenvoudig Angular-project kunt maken, bouwen en bedienen. Ga eerst naar de map webroot van uw server en initialiseer vervolgens als volgt een nieuwe Angular-applicatie (vergeet niet de aanwijzingen te volgen):
cd /var/www/html/
ng new tecmint-app #as root
OR
sudo ng new tecmint-app #non-root user
Ga vervolgens naar de applicatiemap die zojuist is aangemaakt en bedien de applicatie zoals weergegeven.
cd tecmint-app
ls #list project files
ng serve
Voordat u via een webbrowser toegang krijgt tot uw nieuwe app, moet u, als er een firewallservice actief is, poort 4200 openen in de firewallconfiguratie, zoals weergegeven.
---------- On Firewalld ----------
firewall-cmd --permanent --zone=public --add-port=4200/tcp
firewall-cmd --reload
---------- On UFW ----------
sudo ufw allow 4200/tcp
sudo ufw reload
Nu kunt u een webbrowser openen en navigeren met behulp van het volgende adres om de nieuwe app te zien draaien, zoals weergegeven in de volgende schermafbeelding.
http://localhost:4200/
or
http://SERVER_IP:4200
Opmerking: als u de opdracht ng serve gebruikt om een applicatie te bouwen en deze lokaal te bedienen, zoals hierboven weergegeven, bouwt de server de app automatisch opnieuw op en laadt de webpagina('s) opnieuw wanneer u een van de bronbestanden wijzigt.
Voor meer informatie over de ng-tool voert u de volgende opdracht uit.
ng help
De Angular CLI-startpagina: https://angular.io/cli
In dit artikel hebben we laten zien hoe u Angular CLI op verschillende Linux-distributies installeert. We hebben ook besproken hoe u een eenvoudige Angular-toepassing op een ontwikkelingsserver kunt bouwen, compileren en bedienen. Voor vragen of gedachten die u met ons wilt delen, kunt u het onderstaande feedbackformulier gebruiken.