MVC 6 中 @Scripts.Render 的替代品是什么

Question

我正在尝试运行我的 MVC 6 上的一些 d3js 并且正在查看此示例 https://github.com/DustinEwers/D3-DotNetMVC-Demos/blob/master/D3Demos/Views/TagDemos/BasicBarChart.cshtml 并且它使用

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

但如果我这样做，我会得到

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

那么在 MVC 6 中有新的方法吗？

Answer 1

在ASP.NET5中，没有Scripts.Render这个方法。要呈现脚本，您可以使用环境标签助手。

您不必使用环境标签助手。您可以直接将您的脚本标签放在布局文件中。但是环境助手允许我们根据环境有条件地渲染脚本。（压缩捆绑版本 vs 所有未压缩版本）

这是语法，您可以将其包含在布局文件中。

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

假设您的脚本文件 d3.js and d3.min.js 存在于 ~/js 目录中。

你还需要确保你已经在Configure()方法中调用了UseStaticFiles()方法（在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() 扩展方法启用静态文件服务，包括 js 文件，css 文件等..

当您运行处于开发模式的应用程序时，它将在环境 "Development" 中呈现脚本标签，当您运行它处于暂存或生产模式时，它将呈现脚本"Staging,Production" 环境下的标签。

您可以通过右键单击项目和select properties->Debug 并指定环境变量的值来更改环境值Hosting:Environment

你可以看到我在 Staging/Production 环境中包含了缩小版的 js 文件。这不是必需的但首选的方法，因为它会节省一些带宽。（如果你真的想这样做，你也可以把未缩小的版本放在那里而不是缩小。）。如果您只有一个捆绑文件，您也可以在此处使用它而不是单个文件。

如果您还没有缩小版本，您可以通过运行ning 缩小 gulp 任务来生成它。（这包含在默认的 gulp.js 文件中位于新的 Web 应用程序模板中）。您只需要打开任务运行ner 和运行缩小任务。

如果您不想每次都手动运行，您可以 select Bindings -> Before build 这样会自动运行那个小疙瘩 gulp每次构建项目时的任务。

Answer 2

如果您不想运行该脚本，只需创建一个 html 脚本标签：

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

但我真的建议您捆绑并缩小您的资产文件。在 Gulp 和 G运行t 等任务运行人员的帮助下，您可以捆绑、缩小、移动（以及更多）您的 javascript/css 文件。

有关如何使用 gulp 的信息可在此处找到：http://rudiv.se/Article/asp-net-5-bundling-with-bower-and-gulp

然后在 Shyju post 的帮助下，当您运行开发或暂存环境时加载正确的文件。

Answer 3

现在有点复杂，但是documentation解释得很好：

The ASP.NET MVC 5 starter web template utilized ASP.NET’s built-in support for bundling. In ASP.NET MVC 6, this functionality is better performed using client build steps...

因此，要将脚本捆绑在一起，您可以使用 gulp-concat 这样的工具。要包含脚本，只需按照静态内容的方式添加即可：

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

关于包含内容的更完整示例，@Shyju 的回答非常好。

MVC 6 中 @Scripts.Render 的替代品是什么

Whats the replacement for @Scripts.Render in MVC 6

asp.net-mvc

d3.js

asp.net-core-mvc