So installieren Sie Winkel -CLI auf Ubuntu 22.04

Angular CLI ist ein leistungsstarkes Werkzeug, mit dem Entwickler Angular -Anwendungen schnell erstellen und bereitstellen können. Es bietet eine Reihe von Befehlen zum schnellen Erstellen und Bereitstellen von NG-basierten Anwendungen. Wir werden auch einige Merkmale der Winkel -CLI abdecken. Die Merkmale der Winkel -CLI sind:

• Erstellen neuer Projekte mit unterschiedlichen Vorlagen
• Arbeiten mit Dateien und Vermögenswerten
• Bauprojekte für die Produktion
• Generierung von Codegerüsten

In diesem Blog -Beitrag zeigen wir Ihnen, wie Sie Angular CLI auf Ubuntu 22 installieren können.04. Lass uns anfangen!

Schritt 1 - Knoten installieren.JS

Knoten.JS ist die Hauptanforderung für das Ausführen von Winkelanwendungen. Sie können den erforderlichen Knoten installieren.JS Verwendet NVM-Befehlszeilen-Dienstprogramm. Melden Sie sich in Ihrem Ubuntu -System an und folgen Sie:

1. Verwenden Sie den folgenden Befehl, um NVM zu installieren:

   curl https: // raw.GithubuSercontent.com/creationix/nvm/master/installieren.Sh | verprügeln  

2. Aktivieren Sie nun die NVM Enviornemnt in Ihrem System.

   Quelle ~/.bashrc 

3. Ab heute ist Angular 14 die neueste Version, die Knoten versichert.JS 14 LTS und 16 LTS -Versionen. Der folgende Befehl installiert den Knoten.JS 16 auf Ihrem System.

   NVM Installieren Sie V16 

4. Der folgende Befehl zeigt die Version von Knoten und NPM an, die auf Ihrem System installiert sind.

   Knoten -v NPM -v 

Schritt 2 - Installieren von Winkel -CLI

Nach der Installation des Knotens.JS und NPM in Ihrem System verwenden Sie die folgenden Befehle, um das Angular CLI -Tool auf Ihrem System zu installieren.

npm install @angular/cli -location = global 

Installieren Sie Winkel -CLI auf Ubuntu 22.04

Die neueste Version von Angular CLI wird auf Ihrem Ubuntu Linux -System installiert.

Möglicherweise benötigen Sie eine ältere Winkelversion auf Ihrer Maschine. So installieren Sie den Befehl spezifischer Angular -Versionen wie folgt mit der Versionsnummer.

npm install -g @angular/[E -Mail geschützt]10 #Angular 10 npm install -g @angular/[E -Mail geschützt]11 #Angular 11 npm install -g @angular/[E -Mail geschützt]12 #Angular 12 

Durch die Verwendung des Befehls -g -Befehls wird das Angular CLI -Werkzeug weltweit installiert. Daher ist es allen Benutzern und Anwendungen auf dem System zugänglich. Angular CLI liefert einen Befehl ng Wird für Befehlszeilenvorgänge verwendet. Überprüfen wir die installierte Version von NG auf Ihrem System.

Ng Version  

Überprüfen Sie die installierte Winkelversion

Die Angular Command-Line-Schnittstelle wurde auf Ihrem System installiert. Für die vorhandene Anwendung können Sie Ihre Arbeit starten und den Restartikel ignorieren.

Befolgen Sie die nächsten Schritte, um eine neue Winkelanwendung auf Ihrem System zu erstellen.

Schritt 3 - Erstellen Sie eine neue Winkelanwendung

Sie können den Befehl ng verwenden, um eine neue Winkelanwendung zu erstellen. Erstellen Sie die Anwendung mit dem Namen Hello-World mit dem Angular-Befehlszeilenwerkzeug. Unter dem Befehl unten in Terminal ausführen:

Ng neue Hallo-Welt 

OUPUT ? Möchten Sie Winkelrouting hinzufügen?? Ja ? Welches Stylesheet -Format möchten Sie verwenden?? CSS erstellen Hello-World/Readme.MD (1064 Bytes) Erstellen Sie eine Hallo-Welt/.editorconfig (274 Bytes) Erstellen Sie eine Hallo-Welt/.Gitignore (548 Bytes) Erstellen Sie eine Hallo-Welt/Angular.JSON (2947 Bytes) Erstellen Sie Hello-World/Paket.JSON (1042 Bytes) Erstellen Sie Hello-World/Tsconfig.JSON (863 Bytes) erstellen Hallo-Welt/.Browserslistc (600 Bytes) Erstellen Sie eine Hallo-Welt/Karma.Conf.JS (1428 Bytes) Erstellen Sie Hello-World/Tsconfig.App.JSON (287 Bytes) Erstellen Sie Hello-World/Tsconfig.Spezifikation.JSON (333 Bytes) erstellen Hallo-Welt/.VSCODE/Erweiterungen.JSON (130 Bytes) erstellen Hallo-Welt/.VSCODE/Start.JSON (474 ​​Bytes) erstellen Hallo-Welt/.VSCODE/Tasks.JSON (938 Bytes) Erstellen Sie Hello-World/SRC/Favicon.ICO (948 Bytes) Erstellen Sie Hello-World/SRC/Index.HTML (296 Bytes) Erstellen Sie Hello-World/SRC/Main.TS (372 Bytes) Erstellen Sie Hello-World/SRC/Polyfills.TS (2338 Bytes) Erstellen Sie Hello-World/SRC/Stile.CSS (80 Bytes) Erstellen Sie Hello-World/SRC/Test.TS (749 Bytes) Erstellen Sie Hello-World/SRC/Assets/.Gitkeep (0 Bytes) Erstellen Sie Hello-World/SRC/Umgebungen/Umgebungen.prod.TS (51 Bytes) Erstellen Sie Hello-World/SRC/Umgebungen/Umgebungen.TS (658 Bytes) Erstellen Sie Hello-World/SRC/App/App-Routing.Modul.TS (245 Bytes) Erstellen Sie Hello-World/SRC/App/App.Modul.TS (393 Bytes) Erstellen Sie Hello-World/SRC/App/App.Komponente.CSS (0 Bytes) Erstellen Sie Hello-World/SRC/App/App.Komponente.HTML (23364 Bytes) Erstellen Sie Hello-World/SRC/App/App.Komponente.Spezifikation.TS (1088 Bytes) Erstellen Sie Hello-World/SRC/App/App.Komponente.TS (215 Bytes) ✔ Pakete erfolgreich installiert. 

Dadurch wird in Ihrem aktuellen Verzeichnis ein Verzeichnis namens Hello-World erstellt und alle erforderlichen Dateien für eine Winkelanwendung erstellt.

Schritt 4 - Winkelanwendung servieren

Ihre grundlegende Winkelanwendung ist bereit zum Servieren. Wechseln Sie in die Hello-World in das Verzeichnis und führen Sie Ihre Winkelanwendung mit dem Befehl ng servieren aus.

CD Hallo-Welt ng servieren 

Standardmäßig wird Winkelanwendung auf Port 4200 ausgeführt. Sie können auf Ihr System auf Port 4200 zugreifen, um die Winkelanwendung zu öffnen, z. B.:

• http: // localhost: 4200

Sie können den Host und den Port ändern, um die Angularanwendung auszuführen, indem Sie -Host- und -port -Befehlszeilenargumente bereitstellen.

ng serve -host 0.0.0.0 -Port 3001 

Verwenden der Host -Adresse 0.0.0.0 ermöglicht die Anwendung, auf allen Schnittstellen zuzuhören und ist öffentlich zugänglich.

Abschluss

Zusammenfassend hat dieser Artikel Ihnen gezeigt, wie Sie die Winkel -CLI auf Ubuntu 22 installieren können.04. Dieses Tutorial hat Ihnen auch geholfen, eine neue Winkelanwendung zu erstellen. Besuchen Sie nun hier, um die Winkelanwendung hinter dem Apache -Server zu konfigurieren. Wenn Sie auf Probleme stoßen oder Fragen haben, hinterlassen Sie bitte einen Kommentar und ich werde mein Bestes tun, um Ihnen zu helfen. Danke fürs Lesen!.