Heim > Web-Frontend > js-Tutorial > Hauptteil

So stellen Sie ein Angular-Projekt auf Nginx bereit

亚连
Freigeben: 2018-06-21 17:27:53
Original
2242 Leute haben es durchsucht

Angular hat mir schon immer gefallen und ich habe es kürzlich in einem Projekt verwendet, deshalb möchte ich es mit Ihnen teilen. Der folgende Artikel führt Sie hauptsächlich in die relevanten Informationen über Angular-Projekte ein, von der Erstellung über die Verpackung bis hin zur Nginx-Bereitstellung. Der Artikel verwendet Beispiele. Die Codeeinführung ist sehr detailliert, Freunde in Not können sich darauf beziehen.

Vorwort

Derzeit wird AngularJS häufig als MVC verwendet (einige Leute sagen, es sei MV*, darüber machen wir uns vorerst keine Sorgen )-Framework von Javascript. Es bietet einen leistungsstarken Mechanismus für die schnellere und einfachere Entwicklung eines responsiven Webs. Als MVC-Framework unterteilt es den Web-Frontend-Code in die drei Komponenten Model, View und Controller. Daher besteht eine klare Trennung zwischen Datenmodell, Anwendungslogik (Controllern) und Ansichtsdarstellung, sodass Sie sich leichter auf wichtige Entwicklungsbereiche konzentrieren können. Die Ansicht empfängt Daten vom Modell zur Anzeige. Wenn der Benutzer mit der Anwendung durch Klicken oder Tippen auf der Tastatur interagiert, reagiert der Controller mit einer Änderung der Daten im Modell. Schließlich wird die Ansicht über Änderungen im Modell benachrichtigt, sodass sie den angezeigten Inhalt aktualisieren kann.

Kürzlich habe ich eine kleine Anwendung für einen Freund erstellt, der keine Computerkenntnisse hat, und ich möchte dafür Angular verwenden. Wenn wir auf einer IDE entwickeln, verwenden wir im Allgemeinen npm start oder ng Serve, um einen internen Server zu starten. Aber wenn ich das entwickelte Programm einem Freund gebe, wie kann ich ihm ermöglichen, es in seinem Browser zu öffnen? Ich habe hier den Nginx-Server ausgewählt, um mein Programm bereitzustellen.

1. Erstellen Sie ein neues Angular-Programm

1. Installieren Sie nodejs

rrree

3. Installieren Sie Angular CLI

npm install -g cnpm --registry=https://registry.npm.taobao.org
Nach dem Login kopieren

4. Erstellen Sie ein neues Projekt

npm install -g @angular/cli
Nach dem Login kopieren

Installieren Sie abhängige Pakete

Im Verzeichnis mit package.json cnpm install

6. Führen Sie

oder ng serve in der IDE aus, zeigen Sie npm install

in localhost:4200 an. 2. Verpackung

ng build generiert eine dist-Datei im Projektordner, die die gepackten Dateien enthält.

3. Bereitstellung

Laden Sie Nginx von der offiziellen Nginx-Website herunter

Kopieren Sie die gepackte Datei im dist-Ordner nach nginx/html und benennen Sie sie in myProj um

ng new myProj
Nach dem Login kopieren

Klicken Sie auf nginx.exe, um nginx zu starten

Geben Sie localhost:80 in den Browser ein, um das Projekt anzuzeigen

Zu diesem Zeitpunkt müssen wir nur nginx packen und an einen Freund senden Sagen Sie ihm dann, er solle auf klicken. Geben Sie nach nginx.exe localhost:80 in den Browser ein.

Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

So implementieren Sie das Beobachtermuster in JavaScript

So implementieren Sie die explizite und implizite Konvertierung in JavaScript

So verwenden Sie die Redux-Architektur in ReactNative

Das obige ist der detaillierte Inhalt vonSo stellen Sie ein Angular-Projekt auf Nginx bereit. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage