Πού πρέπει να βρίσκονται τα αρχεία .html, .css κ.λπ. για Typescript + Angular 2 + ASP.Net Core 1.0;

Το σεμινάριο Typescript για τη δημιουργία εφαρμογής ASP.Net Core (με ή χωρίς Angular 2) προτείνει να δημιουργήσουμε έναν φάκελο Scripts και να χρησιμοποιήσουμε εργασία gulp για να αντιγράψουμε μόνο τα αρχεία .js στον φάκελο wwwroot, π.χ. κατά τη διάρκεια της κατασκευής.

Τώρα αυτό βγάζει νόημα, αλλά τι κάνουμε με όλα τα αρχεία .html, .css, κ.λπ. που μπορεί να χρησιμοποιήσει το Angular 2; Φαίνεται ότι υπάρχουν γενικά δύο τρόποι για να το κάνουμε:

1. Προσθέτοντάς τα στον φάκελο wwwroot.

   • Οφέλη: δεν χρειάζεται να προσθέσετε εργασία gulp για αυτά τα στατικά αρχεία

   • Μειονεκτήματα: θα χρειαστεί να αντιγράψουμε τη δομή των φακέλων και να κάνουμε ενέργειες όπως αντιγραφή/μετονομασία κ.λπ. δύο φορές

2. Το να τα κρατάμε στο φάκελο Scripts έξω από το wwwroot (τότε θα ήταν καλύτερα να το μετονομάσουμε σε Source ή κάτι τέτοιο).

   • Οφέλη: καμία επανάληψη, όλα σε ένα μέρος

   • Μειονεκτήματα: θα πρέπει να τα αντιγράψουμε στο wwwroot στη δουλειά gulp

Σε περίπτωση 2, το wwwroot γίνεται σαν φάκελος bin για μια κανονική εφαρμογή.

Υπάρχουν επίσημες κατευθυντήριες γραμμές/συστάσεις για το θέμα (δεν κατάφερα να βρω καμία) που μπορώ να χρησιμοποιήσω ως αναφορά;

Απάντηση #1

Γενικά, οι άνθρωποι χρησιμοποιούν τη μέθοδο 2, αν και οι περισσότεροι άνθρωποι (συμπεριλαμβανομένου και εμένα) ονομάζουν τον φάκελο «app» αντί για «source» ή «scripts» και τους αντιγράφουν μέσω του gulp.

Ένας λόγος για να το κάνετε αυτό είναι ότι μπορούμε να εξαιρέσουμε το φάκελο wwwroot από τη διαχείριση του πηγαίου κώδικα. Ένας άλλος λόγος είναι ότι για την παραγωγή θέλετε να δεματοποιήσετε τα αρχεία σας (τόσο html, css όσο και τα προκύπτοντα αρχεία *.js), έτσι ώστε ο φάκελος wwwroot να περιέχει διαφορετικό σύνολο δεδομένων, ανάλογα με το αν αναπτύσσετε ή αν τον υλοποιείτε.

Και δεδομένου ότι το περιεχόμενό του θα αλλάζει συχνά (με κάθε δημιουργία/συσκευασία) και μπορεί να δημιουργεί σχετικά μεγάλα και ελαχιστοποιημένα αρχεία, είναι λιγότερο κατάλληλο για έλεγχο πηγαίου κώδικα ούτως ή άλλως (τα ελαχιστοποιημένα/ασχημοποιημένα/συγχωνευμένα αρχεία είναι δύσκολο/αδύνατο να δημιουργηθούν διαφορές).

Για το Angular συγκεκριμένα, θέλετε να κρατήσετε τα *.html, *.ts, *.js και *.css (μόνο αυτά που σχετίζονται με components) στην ίδια τοποθεσία/υποφάκελο. Το Visual Studio θα τα ομαδοποιήσει αυτόματα (δηλαδή sample.component.html, sample.component.ts, sample.component.css και sample.component.js θα ομαδοποιηθούν μαζί και μπορείτε να τα αναπτύξετε πατώντας το μικρό τρίγωνο δίπλα στο ομαδοποιημένο όνομα) και λειτουργεί καλά για το bundling καθώς τα Angular2 css/template μπορούν να ρυθμιστούν να χρησιμοποιούν τη σχετική διαδρομή του component, αν χρησιμοποιήσετε module loader (συνιστάται!).

Απάντηση #2

Δεν θεωρώ το gulp ένα χρήσιμο εργαλείο, οπότε μην το χρησιμοποιείτε στο πρότυπό μου (ng2+material+asp.net core). Αλλά πρέπει να θυμάμαι να τρέχω το "npm start" για να μεταγλωττίσω οποιεσδήποτε αλλαγές στο ng2 πριν τρέξω το "dotnet run".

Ιδού το πρότυπο λύσης μου που μπορείτε να δοκιμάσετε: https://github.com/Longfld/ASPNETCoreAngular2