Che cosa è la sostituzione per @ Scripts.Render in MVC 6

Question

Sto cercando di eseguire alcuni d3js sul mio MVC 6 e stavo guardando questo esempio https://github.com/DustinEwers/D3-DotNetMVC-Demos/blob/master/D3Demos/Views/TagDemos/BasicBarChart.cshtml e utilizza

@Scripts.Render("~/bundles/d3") 
@section Scripts{ 

Ma se faccio che ottengo

non esiste

il nome di 'script' nel contesto attuale

Così, c'è un nuovo modo per farlo in MVC 6?

Answer 1

In ASP.NET 5, non esiste un tale metodo Scripts.Render. Per eseguire il rendering degli script, è possibile utilizzare l'helper del tag di ambiente.

Non è necessario utilizzare l'helper del tag di ambiente. Puoi mettere direttamente i tag script nel file di layout. Ma gli helper per l'ambiente ci consentono di eseguire il rendering condizionato degli script in base all'ambiente. (Versione con bundle miniato vs All Un minified versione)

Ecco la sintassi, è possibile includere questo nel file di layout.

<environment names="Development"> 
    <script src="~/lib/jquery/dist/jquery.js"></script> 
    <script src="~/js/d3.js"></script> 
</environment> 
<environment names="Staging,Production"> 
    <script src="//ajax.aspnetcdn.com/ajax/jquery/jquery-2.1.4.min.js" 
      asp-fallback-src="~/lib/jquery/dist/jquery.min.js" 
      asp-fallback-test="window.jQuery"> 
    </script>    
    <script src="~/js/d3.min.js" asp-file-version="true"></script> 
</environment> 

Supponendo di avere file di script d3.jsand d3.min.js esistono nel ~/js directory.

Inoltre è necessario assicurarsi che avete invocato il metodo UseStaticFiles() all'interno del metodo Configure() (all'interno Startup.cs)

public void Configure(IApplicationBuilder app, IHostingEnvironment env, 
                  ILoggerFactory loggerFactory) 
{ 
    //Other configuration goes here 
    app.UseStaticFiles(); // This enables static file serving from the app. 
    app.UseMvc(routes => 
     { 
      routes.MapRoute(
       name: "default", 
       template: "{controller=Home}/{action=Index}/{id?}"); 
     }); 
} 

UseStaticFiles() metodo di estensione consente di file statico che serve, tra cui js file, file CSS ecc ..

Quando si esegue l'applicazione in modalità Sviluppo, verranno visualizzati i tag di script nell'ambiente "Development" e quando lo si esegue in Staging o Production, verranno visualizzati i tag di script sotto Ambiente "Staging,Production".

È possibile modificare il valore di ambiente facendo clic destro sul progetto e selezionare properties->Debug e specificare il valore della variabile d'ambiente Hosting:Environment

Si può vedere che ho incluso la versione minified di file JS nella messa in scena/Produzione enviornment. Questo non è necessario ma è un approccio preferenziale in quanto consente di risparmiare un po 'di banda. (È possibile inserire la versione non minificata anche lì invece di minifrata se si vuole veramente farlo.). Se si dispone di un singolo file in bundle, è possibile utilizzarlo anche qui anziché singoli file.

Se non si dispone già di una versione minificata, è possibile generarla eseguendo l'attività di gulp per la minificazione (inclusa nel file gulp.js predefinito che si trova nel nuovo modello di app Web). Devi solo aprire il task runner ed eseguire l'attività di minification.

Se non si desidera eseguire manualmente questo ogni volta, è possibile selezionare Bindings -> Before build in modo che questo verrà eseguito automaticamente che purticular gulp compito ogni volta che si genera il progetto.

Answer 2

Se hai appena wan't per eseguire lo script, è sufficiente creare un tag script HTML:

<script src="js/d3.js?version=1"></script> 

ma vi consiglio davvero che si bundle e la minimizzazione dei tuoi file di risorse. Puoi raggruppare, ridurre, spostare (e molto altro ancora) i tuoi file javascript/css con l'aiuto di taskrunners come Gulp e Grunt.

informazioni su come utilizzare sorso può essere trovato qui: http://rudiv.se/Article/asp-net-5-bundling-with-bower-and-gulp

E poi con l'aiuto di file corretti di carico posta Shyju quando si esegue il vostro sviluppo o staging ambiente.

Answer 3

E 'un po' più complicato ora, ma la documentation spiega abbastanza bene:

L'ASP.NET MVC 5 avviamento Web Template utilizzato di ASP.NET il supporto integrato per la legatura. In ASP.NET MVC 6, questa funzionalità viene eseguita meglio utilizzando client di costruire passaggi ...

Così per raggruppare gli script insieme è possibile utilizzare uno strumento come gulp-concat. E per includere uno script, basta aggiungere nel modo in cui si farebbe se si trattasse di contenuti statici:

<script src="~/lib/bundle.js"></script> 

Per un esempio più completo di contenuti tra cui, la risposta @Shyju è eccellente.