是否可以在每页捆绑脚本和样式答案

【问题标题】：Is it possible to bundle scripts and styles per page是否可以在每页捆绑脚本和样式
【发布时间】：2015-10-30 06:26:14
【问题描述】：

虽然捆绑是 VS 的一个简洁功能，但有时我希望有一个脚本或 css 可用于特定页面。这样，我可以确保避免名称冲突和/或覆盖。

是否可以捆绑文件以便只有全局文件和页面特定文件可用？

例如，假设我有一个名为Cabinet.cshtml 的页面。我也有Cabinet.js 和Cabinet.css 文件。另一方面，我有另一个名为AdminPanle.cshtml 的页面，其中包含文件admin.js 和admin.css。

现在，我希望这两个视图只能访问它们对应的文件以及 jQuery 和 jQuery ui。所以 jQuery 必须是全局的。

【问题讨论】：

您始终可以创建自己的捆绑包 - new ScriptBundle("~/bundles/cabinet") 等，其中包括 jquery、jquery-ui 和 cabinet，并在您的视图中包括 @Scripts.Render("~/bundles/cabinet")。或者仅使用 cabinet 创建捆绑包，并在布局中包含主捆绑包，在页面中包含特定捆绑包
哦，太好了。仅在 Cabinet.cshtml 文件中包含 @Scripts.Render("~/bundles/cabinet") 将解决问题。谢谢斯蒂芬。

标签： asp.net-mvc bundling-and-minification

【解决方案1】：

那么问题是什么？默认情况下，在您的 BundleConfig.cs 中，您拥有：

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                    "~/Scripts/jquery-ui-{version}.js"));

所以把这个包放在你的 _Layout.cshtml 的头上：

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")

并创建 4 个其他捆绑包：

//scripts
bundles.Add(new ScriptBundle("~/bundles/cabinet").Include(
                    "~/Scripts/Cabinet.js"));
bundles.Add(new ScriptBundle("~/bundles/admin").Include(
                    "~/Scripts/admin.js"));
//styles
bundles.Add(new StyleBundle("~/Content/cabinet").Include("~/Content/Cabinet.css"));
bundles.Add(new StyleBundle("~/Content/admin").Include("~/Content/admin.css"));

现在您可以分离这些脚本和样式，并仅将它们添加到您需要的页面上。

另外，我认为最好在 _Layout.cshtml 的 head 标签中定义 2 个部分。

<head>
    //other scripts and styles here
    @RenderSection("scriptslib", required: false)
    @RenderSection("csslib", required: false)
</head>

所以现在在您的视图（Cabinet.cshtml 和 AdminPanle.cshtml）中，您可以将您的库放置在他们认为是这样的位置：

@section scriptslib{
    @Scripts.Render("~/bundles/cabinet")
    }

【讨论】：

我缺少的是我忘记了我可以在特定页面中单独渲染它们。
@Styles.Render("~/bundles/css") 在 @section 中怎么样？我现在正在尝试这样做并获得<link href="/bundles/css" rel="stylesheet"/> :facepalm: