如何在.Net core 2.0 mvc应用程序中使用@ Scripts.Render?

时间:2018-01-24 05:24:23

标签: c# asp.net-mvc razor bundle asp.net-core-2.0

如何将<FrameLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <Spinner android:layout_marginTop="8dp" android:background="@drawable/edit_border" android:visibility="visible" android:id="@+id/teach_repeat" android:entries="@array/on_off" android:textSize="12sp" android:textColor="#ffffff" android:layout_width="match_parent" android:layout_height="40dp" /> <ImageView android:layout_marginTop="8dp" android:layout_gravity="end" android:src="@drawable/ic_arrow_drop_down_white_18dp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </FrameLayout> 与.NET Core 2.0 MVC应用程序一起使用?

我正在将代码从.NET Framework 4.6.1转换为.NET Core 2.0。我已阅读 article 如何捆绑.NET Core 2.0。如何修复错误,并用新版本替换代码?

@Scripts.Render

Code:

它说

  

名称&#39;脚本&#39;在当前上下文中不存在

现有的BundleConfig.cs

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

2 个答案:

答案 0 :(得分:6)

在ASP.Net MVC Core中,他们删除了BundleConfig.cs并替换为bundleconfig.json文件。你需要在bundleconfig.json中指定你的包和缩小逻辑。如果您在项目中没有此文件,请添加具有此名称的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 and minification相关的Microsoft文档,以便更好地了解asp.net core mvc中的捆绑和缩小

答案 1 :(得分:2)

如另一个答案所述,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>