Asp.net Core MVC Umgang mit Validierungsskripten als separate Datei

Question

Ich war gerade dabei, JavaScript-Dateien zu site.js hinzuzufügen und die Seite erkannte die Skripte, aber ich schlug eine Falte, als ich versuchte, die Validierungsskripte zu verschieben site.js.

Site.js erscheint über den Validierungsskripts, die der Seite hinzugefügt werden mit

@{await Html.RenderPartialAsync("_ValidationScriptsPartial");} 

Anstatt die Validierungsskripts für die Seite auf der Seite zu sein (oder ist dies, wie die meisten Menschen es tun), wie füge ich hinzu, sage ich eine validation.js Seite etc, die ich unter dem obigen Eintrag hinzufügen könnte .. weiter,

Wenn ich eine weitere Seite hinzufügen, wie kann ich es verkleinern (fügen Sie es zu GULP) und fügen Sie es in der Produktion Staging-Umgebung als auch ..

Answer 1

Es ist empfehlenswert endete, dass Sie die Validierungsskript-Rendering in einen Abschnitt wie setzen sollte:

@section Scripts { 
    @{ await Html.RenderPartialAsync("_ValidationScriptsPartial"); } 
} 

und dann verweisen sie an der Unterseite des Körpers im _Layout.cshtml als:

@RenderSection("scripts", required: false) 

Dann können Sie validieren Sie Ihre Formulare und diese JS-Dateien werden nur in der Ansicht angezeigt, in der Sie verwiesen haben.

Wenn ich eine andere Seite hinzufügen Wie ich minify es (ihn jetzt an GULP) und in der Produktionsumgebung Inszenierung als auch hinzufügen ..

Sie müssen Ihre JS-Dateien einmal minify für alle Ihre Ansichten (Seiten) und sie werden funktionieren.

Answer 2

Idealerweise möchten Sie, dass alle Skripts am Ende der Seite geladen werden, da Skripts das Rendern Ihrer Seite blockieren und für den Benutzer langsamer erscheinen lassen. Dies erreichen wir, indem wir Abschnitte in unserer Layout-Datei verwenden.

In Ihrem Layout-Datei können Sie den folgenden Code hinzu:

@rendersection("scripts", required: false) 

dann in Ihre Ansichten können Sie spezielle Skripte hinzufügen, die sie benötigen:

@section scripts { 
    @Scripts.Render("~/Scripts/Validation.js") 
} 

Scott Gu hat eine gute blog post, dass erklären Abschnitte ein wenig mehr in der Tiefe

Wie für die Minification haben Sie mit den integrierten Bündelung und Minifikationswerkzeuge, die mit kommen mvc heutzutage? Hier ist eine weitere blog post diesmal von Rick Anderson, die in allem erklärt, aber im Wesentlichen können Sie verschiedene Bundles definieren, die eingestellt werden können, um automatisch die Skripte für Sie zu bündeln und zu minimieren. ein Bündel zu definieren, ist so einfach wie:

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
      "~/Scripts/jquery-{version}.js")); 

und auf Ihre Seite outputing ist das gleiche wie oben, außer anstelle dem Link zu Ihrer Quelldatei Sie das Bundle Link definiert verwenden. Die Ausgabe würde also wie folgt erfolgen:

@Scripts.Render("~/bundles/jquery")