Ausführen von Angular Apps mit Angular CLI und PM2

Angular CLI ist eine Befehlszeilenschnittstelle für Angular Framework, mit der Sie Ihre Anwendung während der Entwicklung lokal erstellen, erstellen und ausführen können.

Es wurde entwickelt, um ein Angular-Projekt auf einem Entwicklungsserver zu erstellen und zu testen. Wenn Sie jedoch Ihre Anwendungen in der Produktion für immer ausführen / am Leben erhalten möchten, benötigen Sie einen Node.js-Prozessmanager wie PM2.

PM2 ist ein beliebter, fortschrittlicher und funktionsreicher Produktionsprozessmanager für Node.js Anwendungen mit integriertem Load Balancer. Der Funktionsumfang umfasst die Unterstützung der Anwendungsüberwachung, die effiziente Verwaltung von Mikrodiensten / -prozessen, die Ausführung des Anwendungsclustermodus sowie den ordnungsgemäßen Neustart und das Herunterfahren von Anwendungen. Außerdem unterstützt es die einfache Verwaltung von Anwendungsprotokollen und vieles mehr.

In diesem Artikel zeigen wir Ihnen, wie Sie ausgeführt werden Winkelig Anwendungen mit Angular CLI und PM2 Node.js Prozessmanager. Auf diese Weise können Sie Ihre Anwendung während der Entwicklung kontinuierlich ausführen.

Bedarf

Sie müssen die folgenden Pakete auf Ihrem Server installiert haben, um fortfahren zu können:

  1. Node.js und NPM
  2. Angular CLI
  3. PM2


Hinweis: Wenn du schon hast Node.js und NPM auf Ihrem Linux-System installiert, springen Sie zu Schritt 2.

Schritt 1: Installieren von Node.js unter Linux

So installieren Sie die neueste Version von Node.jsFügen Sie zuerst die hinzu NodeSource-Repository auf Ihrem System wie gezeigt und installieren Sie das Paket. Vergessen Sie nicht, den richtigen Befehl für das auszuführen Node.js Version, die Sie auf Ihrer Linux-Distribution installieren möchten.

Installieren Sie Node.js unter Ubuntu

$ curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -        #for Node.js version 12
$ curl -sL https://deb.nodesource.com/setup_11.x | sudo -E bash -        #for Node.js version 11
$ curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -        #for Node.js version 10
$ sudo apt install -y nodejs

Installieren Sie Node.js auf Debian

# 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

Installieren Sie Node.js unter CentOS, RHEL & Fedora

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

Installieren Sie außerdem Entwicklungstools auf Ihrem System, damit Sie native Addons von kompilieren und installieren können NPM.

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

Sobald du hast Node.js und NPM installiert, können Sie ihre Versionen mit den folgenden Befehlen überprüfen.

$ node -v
$ npm -v
Überprüfen Sie Node.js und NPM-Version
Überprüfen Sie Node.js und NPM-Version

Schritt 2: Installieren von Angular CLI und PM2

Als nächstes installieren Angular CLI und PM2 Verwendung der npm Paketmanager wie gezeigt. In den folgenden Befehlen wird die -g Option bedeutet, die Pakete global zu installieren – für alle Systembenutzer verwendbar.

$ sudo npm install -g @angular/cli        #install Angular CLI
$ sudo npm install -g pm2                 #install PM2

Schritt 3: Erstellen eines Winkelprojekts mithilfe der Winkel-CLI

Gehen Sie jetzt in die Webroot Verzeichnis Ihres Servers, erstellen, erstellen und bedienen Sie dann Ihre Angular-App (aufgerufen) sysmon-app(durch Angular CLI durch den Namen Ihrer App ersetzen).

$ cd /srv/www/htdocs/
$ sudo ng new sysmon-app        #follow the prompts
Neue Winkel-App erstellen
Neue Winkel-App erstellen

Wechseln Sie als Nächstes in die Anwendung (vollständiger Pfad ist /srv/www/htdocs/sysmon-app) Verzeichnis, das gerade erstellt wurde und die Anwendung wie gezeigt bedient.

$ cd sysmon-app
$ sudo ng serve
Angular App mit Angular CLI bereitstellen
Angular App mit Angular CLI bereitstellen

Aus der Ausgabe der des AufschlagbefehlsWenn Sie sehen, dass die Angular-App nicht im Hintergrund ausgeführt wird, können Sie nicht mehr auf die Eingabeaufforderung zugreifen. Daher können Sie während der Ausführung keine anderen Befehle ausführen.

Sie benötigen also einen Prozessmanager, um die Anwendung zu steuern und zu verwalten: Führen Sie sie kontinuierlich (für immer) aus und aktivieren Sie den automatischen Start beim Systemstart, wie im nächsten Abschnitt erläutert.

Bevor Sie mit dem nächsten Abschnitt fortfahren, beenden Sie den Vorgang durch Drücken von [Ctl + C] um die Eingabeaufforderung freizugeben.

Beenden Sie die Ausführung der Angular App
Beenden Sie die Ausführung der Angular App

Schritt 4: Ausführen von Angular Project Forever mit PM2

Verwenden Sie Folgendes, um Ihre neue Anwendung im Hintergrund auszuführen und die Eingabeaufforderung freizugeben PM2 um es zu dienen, wie gezeigt. PM2 Unterstützt außerdem allgemeine Systemverwaltungsaufgaben wie den Neustart bei einem Fehler, das Stoppen, das Neuladen von Konfigurationen ohne Ausfallzeiten und vieles mehr.

$ pm2 start "ng serve" --name sysmon-app
Führen Sie Angular App Forever aus
Führen Sie Angular App Forever aus

Um auf die Weboberfläche Ihrer Anwendung zuzugreifen, öffnen Sie einen Browser und navigieren Sie anhand der Adresse http://localhost:4200 wie im folgenden Screenshot gezeigt.

Greifen Sie über den Browser auf die Sysmon Angular App zu
Greifen Sie über den Browser auf die Sysmon Angular App zu

Die Angular CLI-Homepage:: https://angular.io/cli
PM2 Homepage:: http://pm2.keymetrics.io/

In diesem Handbuch haben wir gezeigt, wie Angular-Anwendungen mit ausgeführt werden Angular CLI und PM2 Prozessmanager. Wenn Sie weitere Ideen oder Fragen haben, erreichen Sie uns über das unten stehende Feedback-Formular.

Similar Posts

Leave a Reply

Your email address will not be published.