MVC 6 中 @Scripts.Render 的替代品是什么 [英] Whats the replacement for @Scripts.Render in MVC 6

问题描述

我正在尝试在我的 MVC 6 上运行一些 d3js 并且正在查看这个示例

如果你不想每次都手动运行，你可以选择Bindings ->在构建之前，以便每次构建项目时都会自动运行特定的 gulp 任务.

I am trying to run some d3js on my MVC 6 and was looking at this example https://github.com/DustinEwers/D3-DotNetMVC-Demos/blob/master/D3Demos/Views/TagDemos/BasicBarChart.cshtml and it uses

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

But if I do that I get

The name 'Scripts' does not exist in the current context

So is there a new way to do it in MVC 6 ?

解决方案

In ASP.NET 5, There is no such Scripts.Render method. To render scripts, you may use the environment tag helper.

It is not necessary that you should use the environment tag helper. You can directly put your script tags in the layout file. But the environment helpers allows us to conditionally render scripts based on the environment. (Minified-Bundled version vs All Un minified version)

Here is the syntax, you can include this in your Layout file.

<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>

Assuming you have the script files d3.js and d3.min.js exist in ~/js directory.

Also you need to make sure that you have invoked the UseStaticFiles() method inside the Configure() method(inside 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() extension method enables static file serving including js files,css files etc..

When you run the application in Development mode, It will render the script tags inside environment "Development" and when you run it in either Staging or Production, It will render script tags under the "Staging,Production" environment.

You can change the environment value by right clicking on the project and select properties->Debug and specify the value of the environment variable Hosting:Environment

You can see that i have included the minified version of js files in the Staging/Production enviornment. This is not necessary but preferred approach as it will save some bandwidth. (You can put the un-minified version also there instead of minified if you really want to do that.). If you have a single bundled file, you may use that also here instead of individual files.

If you already do not have a minified version, you can generate that by running the gulp task for minification.(This is included in the default gulp.js file which is in the new web app template). You just need to open up the task runner and run the minification task.

If you do not wish to manually run this every time, You may select Bindings -> Before build so that this will automatically run that purticular gulp task everytime you build your project.

这篇关于MVC 6 中 @Scripts.Render 的替代品是什么的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！