2016-10-30 3 views
0

Typescript-Tutorial zum Erstellen von ASP.Net Core-Anwendung (mit oder ohne Angular 2) schlägt vor, dass wir einen Ordner Skripts erstellen und Schluck-Task verwenden, um nur die .js-Dateien in wwwroot Ordner, z. während des Builds.Wo sollten .html, .css usw. Dateien für Typescript + Angular 2 + ASP.Net Core 1.0 liegen?

Jetzt macht das Sinn, aber was machen wir mit all den .html, .css usw. Dateien, die angular 2 verwenden kann. Es scheint, dass es im Allgemeinen zwei Art und Weise tun:

  1. sie wwwroot Ordner hinzufügen.

    • Vorteile: keine Notwendigkeit, schluck Aufgabe für diese statischen Dateien

    • Nachteile hinzuzufügen: wir werden die Ordnerstruktur zu duplizieren und zu tun Operationen Kopieren/Umbenennen/etc zweimal

  2. halten sie im Scripts Ordner außerhalb von wwwroot (dann würden wir besser benennen sie sie in Source oder so ähnlich.

    • Vorteile: keine Vervielfältigung, alles an einem Ort

    • Nachteile: wir haben sie zu wwwroot in schluck Aufgabe wie ein

Im Fall 2 wwwroot wird kopieren bin Ordner für die normale Anwendung.

Gibt es offizielle Richtlinien/Ratschläge zum Thema (ich konnte keine finden), die ich als Referenz verwenden kann?

Antwort

1

Im Allgemeinen verwenden Leute Methode 2, obwohl die meisten Leute (ich eingeschlossen) den Ordner "APP" eher als "Quelle" oder "Indexe" nennen und sie über Schluck kopieren.

Ein Grund dafür ist, dass wir wwwroot Ordner von der Quellcodeverwaltung ausschließen können. Ein weiterer Aspekt ist, dass Sie für die Produktion Ihre Dateien (html, css und die resultierenden * .js-Dateien) bündeln möchten, so dass Ihr wwwroot-Ordner unterschiedliche Daten enthält, je nachdem, ob Sie ihn entwickeln oder bereitstellen.

Und da sein Inhalt sich oft ändert (mit jedem Build/Bundling) und ziemlich große und minimierte Fliegen erzeugen kann, ist es sowieso weniger für die Quellcodeverwaltung geeignet (verkleinerte/konifizierte Dateien sind schwer/schwierig/unmöglich zu erstellen) Diffs für).

Für angular im Besonderen möchten Sie die * .html, * .ts, * .js und * .css (nur diejenigen, die sich auf Komponenten beziehen) im selben Verzeichnis/Unterordner behalten. Visual Studio gruppiert sie automatisch zusammen (dh sample.component.html, sample.component.ts, sample.component.css und sample.component.js werden zusammen gruppiert und Sie können sie durch Drücken auf das kleine Dreieck neben dem gruppierten Namen entfalten) und es funktioniert gut zum Bündeln, da angular2 css/template erstellt werden kann Verwenden Sie component relative path, wenn Sie einen Modullader verwenden (empfohlen!).

+0

Vielen Dank für die ausführliche Antwort. Ich dachte auch so, dann wird unser 'wwwroot' wirklich analog zum' bin' Ordner, den wir nie in der Quellcodeverwaltung haben wollen. Wie Sie die Bündelung erwähnt haben, die eine gute Idee ist, habe ich mich gefragt, ob Sie bei der Bündelung der CSS helfen können. Es ist alles beschrieben, wie HTML zu bündeln, aber die Bündelung CSS kann ich überhaupt nicht finden (wir können nicht gewöhnliche CSS-Datei Bundle, da eckig braucht sie zu verarbeiten). Habe eine separate Frage http://stackoverflow.com/questions/40283535/how-to-bundle-angular-2-component-css gestellt, aber habe dort keine Antwort bekommen. –

0

Ich fühle mich nicht Schluck als ein hilfreiches Werkzeug, also verwenden Sie es nicht in meiner Vorlage (ng2 + Material + asp.net Kern). aber müssen Sie daran denken, "npm start" auszuführen, um alle ng2-Änderungen vor dem Ausführen von "dotnet run" zu kompilieren.

hier ist meine Lösung Vorlage, die Sie ausprobieren können: https://github.com/Longfld/ASPNETCoreAngular2