it-swarm.com.de

Hosting Angular 2 App

Ich bin neu bei Angular 2, ich kenne Host Angular 1.x bei Shared Hosting wie GoDaddy, aber ich habe keine Ahnung, wie Angular 2-Anwendung veröffentlicht wird. Ich habe zum Beispiel diesen Strukturordner:

angular2-quickstart

--app
  app.component.ts
  main.ts

--node_modules

--typings

index.html
package.json
styles.css
systemjs.config.js
tsconfig.json
typings.json

Welche Datei muss ich auf ftp hochladen?

Ich habe nichts versucht, weil ich nicht weiß, wie ich vorgehen soll
Danke im Voraus!

11
user1608228

Als komponentenbasierte Sprache umfasst die Version 2 einige Vorbehalte beim Implementierungsprozess ..__ Zuerst werden die in der Entwicklungsumgebung verwendeten Dateien nicht unbedingt an die Produktion ausgeliefert. Kurz gesagt, Sie müssen nur die Dateien .js, .html und .css hochladen.

Zweitens ist es ratsam, selbst wenn Ihre Anwendung nur die oben genannten Dateien bereitstellt, den folgenden Prozess einzubeziehen:

Bündeln: Kompilieren aller JS-Dateien in einzelne Dateien. Zum Beispiel könnte vendor.js alle Bibliotheken von Drittanbietern enthalten, und bundle.js würde alle .js-Dateien der Anwendung enthalten. (Pakete werden aus Performancegründen importiert, bedenken Sie jedoch, dass dieser Prozess mit der Einführung von http 2 abgebrochen wird).

Minification: Dies ist ein Standardprozess in allen Web-Apps, aber Sie minimieren jetzt nur die gebündelten Dateien.

Schauen Sie sich diesen Artikel an, der einige Beispiele für Tools enthält, die Sie beim Bereitstellungsprozess unterstützen können http://www.ninjaducks.in/hacking/angular-setup/

5
Daniel Pliscki

Wenn Sie kein Backend haben, suchen kostenlose Hosting-Sites normalerweise nach einer index.html, um ihre Arbeit zu beginnen. Daher ist Ihre Ordnerstruktur korrekt, Sie müssen jedoch die js-Dateien anstelle der ts-Dateien hochladen.

5
eko

Ich denke, dass ein beliebter Workflow darin besteht, Ihre .ts-Dateien zu verschlucken und die resultierenden .js-Dateien in einen Distributionsordner zu senden. Die vielen .js-Dateien können auch "gulp-concatenated" (gulp-concat) in einer Datei sein.

Natürlich müssen Sie auch Ihre HTML- und CSS-Dateien senden.

Da die Angular2-Bibliothek auch stark vom Inhalt des Knotens "node_modules" abhängig ist, müssen Sie Ihre package.json- und npm-Installation auf dem Server hochladen. Sie können versuchen, die node_modules hochzuladen, der Upload dauert jedoch viel Zeit.

4
Pat M

Sie müssen ein angle2-Projekt mithilfe von Tools wie webpack oder angle-cli erstellen, die auch Webpack Post Beta.14 verwenden. Webpack erstellt ein Distributionsverzeichnis - dist -, das Sie auf dem Server bereitstellen können. Webpack bündelt den gesamten Code in einer einzigen Datei, die er im dist-Ordner ablegt. Hier finden Sie eine gute Ressource, um den Code und die Implementierungsstruktur der angle2-App zu verstehen: https://github.com/mirkonasato/angular2-course-webpack-starter

Klonen Sie das obige Verzeichnis, führen Sie "npm install" aus, um alle Abhängigkeiten zu installieren, und führen Sie "npm run build" aus. Sie sehen den Distributionsordner "dist", den Sie bereitstellen können.

1
UsmanChaudhri

Nun, Sie können ng build in Ihrem Stammverzeichnis der Anwendung ausführen. Es erstellt ein dist-Verzeichnis mit der App und den Dateien. Sie können dieses Verzeichnis in die Seite einfügen, die der Webserver nach der index.html sucht

0
Max