Heim  >  Artikel  >  Web-Frontend  >  Tutorial zur Einrichtung der AngularJS-Umgebung für Anfänger

Tutorial zur Einrichtung der AngularJS-Umgebung für Anfänger

小云云
小云云Original
2018-01-20 13:27:031157Durchsuche

Dieser Artikel stellt hauptsächlich den Prozess der Einrichtung der AngularJS-Umgebung vor. Ich hoffe, er kann Ihnen helfen.

Was ist AngularJS?

AngularJS ist ein Open-Source-Webanwendungs-Framework. Es wurde ursprünglich 2009 von MISKO Hevery und Adam Abrons entwickelt. Jetzt von Google verwaltet

AngularJS-Funktionen

AngularJS ist ein leistungsstarkes JavaScript-basiertes Entwicklungsframework zum Erstellen von Rich Internet Applications (RIA).

AngulajJS bietet Entwicklern die Möglichkeit (mit JavaScript), clientseitige Anwendungen auf saubere MVC-Weise (Model-View-Controller) zu schreiben.

In AngularJS geschriebene Anwendungen sind browserübergreifend kompatibel. AngularJS verwendet JavaScript-Code, um die Anpassung an jeden Browser automatisch vorzunehmen.

AngularJS ist Open Source, völlig kostenlos und wird von Tausenden von Entwicklern auf der ganzen Welt entwickelt und gepflegt. Es wird unter der Apache-Lizenz Version 2.0 veröffentlicht.

Insgesamt ist AngularJS ein Framework zum Erstellen umfangreicher, leistungsstarker Webanwendungen, das gleichzeitig eine einfache Wartung ermöglicht.

1. Hier ist eine kurze Einführung in die Funktionen von Angular-cli:

Angular-cli kann schnell ein Framework erstellen und Module, Dienste, Klassen, Anweisungen usw. erstellen; >

Ja Die Funktion von Webpack kann Codetrennung, Laden bei Bedarf usw. realisieren;

konfiguriert automatisch die Entwicklungsumgebung, Testumgebung und Produktionsumgebung und kann Codepaketierung, Komprimierung und Hot-Deployment realisieren , und kann auch Modultests und End-to-End-Tests realisieren

Angular-cli kann die Vorkompilierung von sass und weniger durch Suffixe automatisch identifizieren

Angular-cli kann TypeScript konfigurieren, wenn Erstellen und können auch einige personalisierte Konfigurationen vornehmen. Die mit Angular-CLI erstellte Projektstruktur ist die beste Vorgehensweise und kann in der Produktionsumgebung verwendet werden.

AngularJS muss Nodejs verwenden, daher müssen wir zuerst Nodejs installieren. Die Download-Adresse von Nodejs lautet: https://nodejs.org/en/download/,

3. Installieren Sie npm und cnpm

Der nächste Schritt ist die Installation von npm.

NPM ist ein Paketverwaltungstool, das zusammen mit NodeJS installiert wird. Es kann viele Probleme bei der Bereitstellung von NodeJS-Code lösen Folgendes enthalten:

Erlauben Sie Benutzern, andere vom NPM-Server herunterzuladen. Schreiben Sie Pakete von Drittanbietern für die lokale Verwendung.

Ermöglicht Benutzern das Herunterladen und Installieren von von anderen geschriebenen Befehlszeilenprogrammen vom NPM-Server zur lokalen Verwendung.

Ermöglicht Benutzern das Hochladen von Paketen oder Befehlszeilenprogrammen, die sie schreiben, auf den NPM-Server, damit andere sie verwenden können.

Die Installation von nodejs und npm ist hier abgeschlossen. Wenn Sie npm zur Installation in Datianchao verwenden, werden wir jedoch cnpm verwenden, um es zu installieren, was ebenfalls ein Paket von npm ist.

Installieren Sie cnpm und führen Sie den Befehl aus

npm i -g cnpm

Warten Sie nach der Ausführung dieses Befehls auf den Abschluss und geben Sie dann die cnpm-Version ein, um zu überprüfen, ob die Installation abgeschlossen ist. Ich habe es hier bereits installiert, Sie können also hineingehen.

Nach der Installation von cnpm beginnen wir mit der Installation von Angular-cli.

Führen Sie den Befehl aus

cnpm i -g angle-cli

Anschließend können Sie den Befehl ng version ausführen, um zu überprüfen, ob die Installation abgeschlossen ist und welche Version von angle-cli vorliegt

Nachdem die Installation abgeschlossen ist, können wir den Befehl ng verwenden und mit der Erstellung des Projekts beginnen.

4. Projekterstellung

Nach der Installation von angle-cli können Sie den Befehl

ng new JustForTest

an der Stelle erstellen, an der sich JustForTest befindet Der Projektname

Durch die Ausführung dieses Befehls werden viele Dateien erstellt, und Sie müssen eine Weile warten. Dieser Schritt wird lange dauern und Sie müssen warten, bis die Installation von nod_.modules abgeschlossen ist.

Beginnen Sie direkt mit der Nutzung von ng Serve.

Auf diese Weise können Sie das Projekt direkt starten: http://localhost:4200 und Sie können direkt darauf zugreifen:

Das Projekt importieren

Wenn ja, wie starten wir ein Projekt lokal, wenn wir es online finden? Machen wir es im Detail:

Ich empfehle jedem, sich dieses Tutorial von Teacher Da Mo anzusehen: Angular2.0-Video-Tutorial ist hier

Für die Demonstration verwenden wir hier auch ein Projekt von Lehrer Da Mo: NiceFish, zuerst müssen wir das Projekt über Git klonen, was hier nicht demonstriert wird. Dies ist die Projektadresse von NiceFish: http://git.oschina.net/mumu-osc/NiceFish

Nachdem das Projekt geklont wurde, gibt die Befehlszeile das Verzeichnis ein, in dem sich das Projekt befindet.

Führen Sie den Befehl aus

cnpm i -g @angular/cli

Lassen Sie mich hier erklären, dass wir zuvor das globale Angular-Cli installiert haben.

Warten Sie, bis die Befehlsausführung abgeschlossen ist, und führen Sie dann den Befehl aus

cnpm install

Führen Sie dann den Befehl aus

ng dienen -prod -aot

Warten Sie dann, bis die Kompilierung abgeschlossen ist.

Nach Abschluss können wir im Browser Folgendes eingeben:

http://localhost:4200, um auf das Projekt zuzugreifen.

Verwandte Empfehlungen:

AngularJs-Benutzeranmeldungsproblembehandlung

AngularJS implementiert die Funktion zur Formularüberprüfung der Mobiltelefonnummer

Einige Verwendungen von AngularJS

Das obige ist der detaillierte Inhalt vonTutorial zur Einrichtung der AngularJS-Umgebung für Anfänger. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn