Angular CLI – So erstellen Sie ein neues Angular-Projekt unter Linux
Angular ist ein beliebtes und hochgradig erweiterbares Open-Source-Framework für die Entwicklung von Front-End-Anwendungen, das zum Erstellen mobiler und Webanwendungen mit TypeScript/JavaScript verwendet wird. und andere gängige Sprachen.
Angular ist ein Überbegriff für alle Angular-Versionen, die nach AngularJS (oder Angular Version 1.0) folgen, einschließlich Angular 2 und Angular 4.
Angular eignet sich gut zum Erstellen kleiner bis großer Anwendungen von Grund auf. Eine der Schlüsselkomponenten der Angular-Plattform zur Unterstützung der Anwendungsentwicklung ist das Angular CLI-Dienstprogramm – ein einfaches und benutzerfreundliches Befehlszeilentool zum Erstellen Angular-Anwendungen verwalten, erstellen und testen.
In diesem Artikel erklären wir, wie Sie das Befehlszeilentool Angular auf einem Linux-System installieren und lernen einige grundlegende Beispiele dieses Tools kennen.
Node.js unter Linux installieren
Um Angular CLI zu installieren, muss die neueste Version von Node.js und NPM auf Ihrem Linux-System installiert sein.
Installieren Sie Node.js unter 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
Installieren Sie Node.js unter 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
Installieren Sie Node.js auf RHEL, CentOS, Fedora, Rocky und 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
Um native Add-ons von NPM zu kompilieren und zu installieren, müssen Sie außerdem möglicherweise Entwicklungstools wie folgt auf Ihrem System installieren.
sudo apt install -y build-essential [On Debian/Ubuntu]
sudo yum install gcc-c++ make [On RHEL Systems]
Angular CLI unter Linux installieren
Sobald Sie Node.js und NPM installiert haben, wie oben gezeigt, können Sie Angular CLI mit dem npm-Paketmanager installieren. wie folgt (das Flag -g bedeutet, dass das Tool systemweit installiert wird, damit es von allen Systembenutzern verwendet werden kann).
npm install -g @angular/cli
OR
sudo npm install -g @angular/cli
Sie können die Angular CLI mit der ausführbaren Datei ng starten, die nun auf Ihrem System installiert sein sollte. Führen Sie den folgenden Befehl aus, um die installierte Version von Angular CLI zu überprüfen.
ng version
OR
ng --version
Erstellen eines Angular-Projekts mit Angular CLI
In diesem Abschnitt zeigen wir, wie Sie ein neues, grundlegendes Angular-Projekt erstellen, erstellen und bereitstellen. Wechseln Sie zunächst in das webroot-Verzeichnis Ihres Servers und initialisieren Sie dann wie folgt eine neue Angular-Anwendung (denken Sie daran, den Anweisungen zu folgen):
cd /var/www/html/
ng new tecmint-app #as root
OR
sudo ng new tecmint-app #non-root user
Wechseln Sie als Nächstes in das gerade erstellte Anwendungsverzeichnis und stellen Sie die Anwendung wie gezeigt bereit.
cd tecmint-app
ls #list project files
ng serve
Bevor Sie über einen Webbrowser auf Ihre neue App zugreifen können und ein Firewall-Dienst ausgeführt wird, müssen Sie wie gezeigt Port 4200 in der Firewall-Konfiguration öffnen.
---------- On Firewalld ----------
firewall-cmd --permanent --zone=public --add-port=4200/tcp
firewall-cmd --reload
---------- On UFW ----------
sudo ufw allow 4200/tcp
sudo ufw reload
Jetzt können Sie einen Webbrowser öffnen und über die folgende Adresse navigieren, um zu sehen, wie die neue App ausgeführt wird, wie im folgenden Screenshot gezeigt.
http://localhost:4200/
or
http://SERVER_IP:4200
Hinweis: Wenn Sie den Befehl ng dienen, um eine Anwendung zu erstellen und lokal bereitzustellen, wie oben gezeigt, erstellt der Server die App automatisch neu und lädt die Webseite(n) neu, wenn Sie eine der Quelldateien ändern.
Für weitere Informationen zum ng-Tool führen Sie den folgenden Befehl aus.
ng help
Die Angular CLI-Homepage: https://angular.io/cli
In diesem Artikel haben wir gezeigt, wie man Angular CLI auf verschiedenen Linux-Distributionen installiert. Außerdem haben wir erläutert, wie man eine einfache Angular-Anwendung auf einem Entwicklungsserver erstellt, kompiliert und bereitstellt. Für Fragen oder Gedanken, die Sie uns mitteilen möchten, verwenden Sie das unten stehende Feedback-Formular.