如何在.Net Core 2.0 MVC应用程序中使用@Scripts.Render？

Question

如何在.Net Core 2.0 MVC应用程序中使用@Scripts.Render？

c#asp.netbundleasp.net-core-2.0

22

我该如何在.NET Core 2.0的MVC应用程序中使用@Scripts.Render？

我正在将代码从.NET Framework 4.6.1转换到.NET Core 2.0。我已经阅读了这里有关如何在.NET Core 2.0中进行捆绑的内容。我该如何修复错误并使用新版本替换旧代码？

代码:

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

它说：

在当前上下文中，名称“Scripts”不存在。

现有的BundleConfig.cs：

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
        "~/Scripts/jquery-{version}.js"));
    bundles.Add(new ScriptBundle("~/bundles/jqueryvalidate").Include(
    BundleTable.EnableOptimizations = true;
}

- Sajeetharan

2个回答

7

如其他答案所述，BundleConfig.cs 已被删除。但是，@Scripts.Render() 有一些不错的用例，并且用静态的 <script src="..."></script> 替换它并不是一个好主意。在仅想链接到某些页面上的库文件而非全部页面时，您不希望重复相同的代码，特别是当您链接到带有回退的CDN中的库文件时。因此，这里是我使用的替代旧的好用的 @Scripts.Render() 的良好方法：

首先为您的库文件创建一个局部视图。如果您喜欢，可以将使用的那些库文件合并到同一个视图中。将其视为在 BundleConfig.cs 中创建捆绑包。例如，您可以像这样为 jQuery 验证创建一个视图：

<environment include="Development">
    <script src="~/lib/jquery-validate/jquery.validate.js"></script>
    <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script>
</environment>
<environment exclude="Development">
    <script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.19.0/jquery.validate.min.js"
            asp-fallback-src="~/lib/jquery-validate/jquery.validate.min.js"
            asp-fallback-test="window.jQuery && window.jQuery.validator"
            crossorigin="anonymous"
            integrity="sha384-jR1IKAba71QSQwPRf3TY+RAEovSBBqf4Hyp7Txom+SfpO0RCZPgXbINV+5ncw+Ph">
    </script>
    <script src="https://ajax.aspnetcdn.com/ajax/jquery.validation.unobtrusive/3.2.10/jquery.validate.unobtrusive.min.js"
            asp-fallback-src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"
            asp-fallback-test="window.jQuery && window.jQuery.validator && window.jQuery.validator.unobtrusive"
            crossorigin="anonymous"
            integrity="sha384-y9k3BO+hbWD6gTgtfMyg1egwFmd2oEgQ0fALVtFnCl9F6j6mCh+oCa0P0h+aj7Ii">
    </script>
</environment>

你可以将其命名为_ValidationScriptsPartial.cshtml之类的名称。

现在，在需要验证的页面上，你可以像这样注入部分视图：

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

当然，对于那些每个页面都需要的库（例如jQuery和Bootstrap），您可以像这样直接在_Layout.cshtml中注入它们：

<!DOCTYPE html>
<html>
<head>
    ...
    @await Html.PartialAsync("_LayoutHeadScriptsPartial")
</head>
<body>
    ...
    @RenderBody()
    ...
    @await Html.PartialAsync("_LayoutFooterScriptsPartial")
    @RenderSection("scripts", required: false)
</body>
</html>

- Racil Hilan

有没有方便的方法来确定“integrity”属性的哈希值？ - xr280xr

1

@xr280xr 一些CDN有复制带哈希标签的选项。或者，您可以使用这个免费工具https://www.srihash.org/。 - Racil Hilan

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Ahamed Ishak · Accepted Answer

在ASP.Net MVC Core中，他们删除了BundleConfig.cs文件，并替换为bundleconfig.json文件。您需要在bundleconfig.json中指定您的bundle和缩小逻辑。如果您的项目中没有这个文件，请添加一个名为json的文件。 bundleconfig.json 此文件的内容应如下所示。

  // Configure bundling and minification for the project.
// More info at https://go.microsoft.com/fwlink/?LinkId=808241
[
  {
    "outputFileName": "wwwroot/css/site.min.css",
    // An array of relative input file paths. Globbing patterns supported
    "inputFiles": [
      "wwwroot/css/site.css"
    ]
  },
  {
    "outputFileName": "wwwroot/js/bundles.min.js",
    "inputFiles": [
      "wwwroot/js/site.js",
      "wwwroot/lib/jquery/dist/jquery.js",
      "wwwroot/lib/jquery/dist/jqueryvalidate.js"
    ],
    // Optionally specify minification options
    "minify": {
      "enabled": true,
      "renameLocals": true
    },
    // Optionally generate .map file
    "sourceMap": false
  }
]

_Layout.cshtml

 <script src="~/js/bundles.min.js"></script>

阅读有关 Bundling 和 minification 的 Microsoft 文档，以深入了解 ASP.NET Core MVC 中的 Bundling 和 minification。