So installieren Sie Winkel -CLI auf Ubuntu 20.04

So installieren Sie Winkel -CLI auf Ubuntu 20.04

Angular ist das beliebteste Framework, das zum Erstellen von mobilen und Webanwendungen verwendet wird. Angular ist ein Open-Source-Webanwendungsrahmen, das von Google entwickelt wurde und eine große Community von Einzelpersonen. Ab heute ist Angular 10 die neueste Version für die Installation. Dieses Tutorial hilft Ihnen bei der Installation des Angular -Cli -Knotenmoduls auf Ihrem Ubuntu 20.04 Linux -System.

Schritt 1 - Knoten installieren.JS

NVM ist ein Befehlszeilenwerkzeug zum Installieren und Verwalten von Knoten.JS auf Linux -System. Zuerst müssen wir NVM auf unserem System installieren. Melden Sie sich beim System mit dem Benutzer an, für den Sie den Knoten installieren müssen.JS, dann den Befehl unten ausführen, um NVM zu installieren:

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

Danach können Sie jede Version des Knotens auf Ihrem System installieren. Sie können auch mehrere Knotenversionen auf einem einzelnen System installieren. Führen Sie die folgenden Befehle aus, um die Umgebung zu laden und den neuesten Knoten zu installieren.JS -Version:

Quelle ~/.bashrc NVM Knoten installieren 

Der obige Befehl zeigt die auf Ihrem System installierte Version von Knoten und NPM an.

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 -g @angular/cli installieren 

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]8 #Angular 8 npm install -g @angular/[E -Mail geschützt]9 #Angular 9 npm install -g @angular/[E -Mail geschützt]10 #Angular 10 

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 -Verssion _ _ ____ _ ___ / \ _ __ __ _ _ _ | | __ _ _ __ / ___ | | | _ _ | / △ \ | '_ \ / _' | | | | |/ _ '| '__ | | | | | | | / ___ \ | | | | (_ | | | _ | | | (_ | | | | ___ | ___ | | / _ / \ _ \ _ | | _ | \ __, | \ __, _ | _ | \ __, _ | _ | | \ ____ | _____ | ___ | | ___/ Angular cli: 10.1.1 Knoten: 14.10.1 OS: Linux X64 Angular:… IVY Workspace: Paketversion --------------------------------- ----------------- @Angular-Devkit/Architect 0.1001.1 @Angular-Devkit/Core 10.1.1 @Angular-Devkit/Schematik 10.1.1 @Schematik/Angular 10.1.1 @Schematik/Update 0.1001.1 RXJS 6.6.2 

Angular Command Line -Schnittstelle wurde auf Ihrem System installiert. Für die vorhandene Anwendung können Sie mit Ihrem Arbeitsplatz beginnen und Ruheartikel ignorieren.

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

Schritt 3 - Erstellen einer neuen 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 

Ausgang:

? Möchten Sie Winkelrouting hinzufügen?? Ja ? Welches Stylesheet -Format möchten Sie verwenden?? CSS erstellen Hello-World/Readme.MD (1028 Bytes) Erstellen Sie eine Hallo-Welt/.editorconfig (274 Bytes) Erstellen Sie eine Hallo-Welt/.Gitignore (631 Bytes) Erstellen Sie eine Hallo-Welt/Angular.JSON (3606 Bytes) Erstellen Sie eine Hallo-Welt/Paket.JSON (1254 Bytes) Erstellen Sie Hello-World/Tsconfig.JSON (458 Bytes) Erstellen Sie Hello-World/Tslint.JSON (3185 Bytes) erstellen Hallo-Welt/.Browserslistc (853 Bytes) Erstellen Sie Hello-World/Karma.Conf.JS (1023 Bytes) Erstellen Sie Hello-World/Tsconfig.App.JSON (287 Bytes) Erstellen Sie Hello-World/Tsconfig.Spezifikation.JSON (333 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 (2835 Bytes) Erstellen Sie Hallo-Welt/SRC/Stile.CSS (80 Bytes) Erstellen Sie Hello-World/SRC/Test.TS (753 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 (662 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 (25757-Bytes) Erstellen Sie Hello-World/SRC/App/App.Komponente.Spezifikation.TS (1072 Bytes) Erstellen Sie Hello-World/SRC/App/App.Komponente.TS (215 Bytes) Erstellen Sie Hello-World/E2E/Prospractor.Conf.JS (869 Bytes) Erstellen Sie Hello-World/E2E/Tsconfig.JSON (294 Bytes) Erstellen Sie Hello-World/E2E/SRC/App.E2E-Spec.TS (644 Bytes) Erstellen Sie Hello-World/E2E/SRC/App.po.TS (301 Bytes) ✔ erfolgreich installiert. Erfolgreich initialisierte Git. 

Dadurch wird in Ihrem aktuellen Verzeichnis ein Verzeichnis namens Hello-World erstellt und alle Forderungsdateien 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 Host und Port ändern, um die Angularanwendung auszuführen, indem Sie -host- und -Port -Befehlszeilenargumente bereitstellen.

ng serve -host 0.0.0.0 -Port 8080 

Die IP -Adresse 0.0.0.0 hört auf allen Schnittstellen und öffentlich zugänglich zu.

Abschluss

In diesem Tutorial haben Sie gelernt, Angular Command-Line-Dienstprogramm als Knotenpaket zu installieren. Dieses Tutorial hat Ihnen auch geholfen, eine neue Winkelanwendung zu erstellen. Besuchen Sie nun hier, um die Winkelanwendung hinter dem Apache -Server zu konfigurieren.