将附加文件添加到 C# 脚本和 css 包

Question

好的，所以我一直在使用 C# 捆绑来缩小和组合脚本和 css。

但我不确定如何将脚本附加到已创建的包中。

我正在尝试附加到捆绑包，因为并非所有脚本都在同一个文件中找到，因为我正在 visual studio 中使用 nopcommerce 解决方案。所以脚本被添加到整个解决方案中。

这是捆绑代码：

bundles.Add(new ScriptBundle("~/Content/themes/base/js/scripts/footeroptimized").Include(
    "~/Themes/MyTheme/Content/js/bootstrap.min.js",
    "~/Scripts/jquery.validate.min.js",
    "~/Scripts/jquery.validate.unobtrusive.min.js",
    "~/Scripts/public.common.min.js",
    "~/Themes/MyTheme/Content/js/readmore.min.js"));

我想也许我可以使用 bundle .Add() 函数，但我得到一个错误：

 bundles.Add("~/Themes/MyTheme/Content/js/global.min.js"));

错误是："Cannot convert from string to system.web.optimization.bundle"

我找不到任何解释我收到该错误的原因。

我还添加了用于优化的 using 语句 @using System.Web.Optimization;

任何人都知道如何添加到已经创建的包中。

更新：

我也尝试过以下方法，但没有用：

var footerScriptBundle = new ScriptBundle("~/Content/themes/base/js/scripts/footeroptimized");
footerScriptBundle.Include(
    "~/Themes/MyTheme/Content/js/bootstrap.min.js",
    "~/Scripts/jquery.validate.min.js",
    "~/Scripts/jquery.validate.unobtrusive.min.js",
    "~/Scripts/public.common.min.js",
    "~/Themes/MyTheme/Content/js/readmore.min.js");

footerScriptBundle.Include("~/Themes/MyTheme/Content/js/global.min.js");

干杯

Answer 1

您描述的用例不适用于捆绑包。您不能在运行时间修改捆绑包，即使可以，这样做也没有意义。

想一想。您访问一个页面，请求并接收浏览器缓存的包 abc.js。然后，您访问另一个页面，该页面也要求 abc.js，只是您希望内容不同。除此之外，浏览器不会请求该文件，并且会重用旧文件，因为它已被缓存。捆绑包用于避免跨多个页面发送始终需要的文件。

如果您确实需要捆绑额外的文件，那么您需要将不同的文件放入它们自己的捆绑包中并在每个页面上请求两个捆绑包，或者为每个不同的场景创建一个捆绑包，一个包含所有文件的捆绑包基本文件加上特定于站点区域的文件。

但是，如果只需要一个额外的文件，而您尝试添加到包中的文件仅在一个页面上使用，那么您就错了。该文件根本不属于捆绑包！只需像往常一样使用普通的 <script> 或 <link> 标签即可。即使您有多个文件，如果它们只用在一个页面上，也许您可以将它们组合成一个（未捆绑的）文件。或者按照上面的建议，为这几个文件制作一个特殊的捆绑包，并将其作为第二个单独的捆绑包包含或不包含。

浏览器必须请求两个对象（一个包和一个页面特定 javascript 或第二个包）的额外开销并不大。尝试以这种方式构建捆绑包不会获得太多价值，而且这样做会让人头疼到噩梦般的程度。不要那样做。

有一天使用 HTTP 2.0，我们可能会忘记捆绑，因为浏览器可能会通过单个请求请求多个文件，然后在单个响应中收到所有答案。到那时，缩小仍然很重要，但我们会完全放弃捆绑，因为它们的好处将通过协议本身完全实现。仍然可能有多个请求，按照可以从中为请求提供服务的行拆分，例如一个请求可以从 CDN 提供的所有静态内容（图像、视频、样式表、javascript 等），以及对所有动态内容的一个请求。

Answer 2

因为我在研发之间丢失了这个问题的 URL 因此我在 MSDN 博客上留下了回复（所以下面的 txt 不是侵犯版权）。
https://blogs.msdn.microsoft.com/rickandy/2012/08/14/adding-bundling-and-minification-to-web-forms/#comment-47175

在 MasterPage 中包含文件的原因是将公共文件放在一个与其相关的位置，但这可能会为其他目的提供解决方案：
顺便说一句，它本质上不必在 global.asax 中注册。我喜欢在 MasterPage 中有 url 捆绑文件列表（在一个地方有相关的东西）所以我误用了 :) BundleConfig 中名为 "IsRegistered" 的静态布尔值？初始化为 false，然后在 RegisterBundles 中检查它（如果为真 return），否则使其为真并进行注册。现在你的 BundleConfig 中有 2 个其他方法作为 RenderJS 和 RenderCSS（它们调用主要 Styles.Render 和 Scripts.Render）但是在渲染之前这些方法调用 RegisterBundles 方法（就像 PreRender 事件）因此现在派生 2 个控件在注册为 TagPrefix 的命名空间中，控件是接受 Src 和 Href 的 JSBundle 和 CSSBundle，并且它们的 setter 添加路径到 BundleConfig 中的其他 2 个数组（唯一）。最后，RegisterBundles 使用数组将其包含在包中。万岁，现在我可以从 Master.cs 添加文件，甚至可以在 master 本身中添加文件，但只能在渲染时间之前而不是 Application_Start
在 master 中调用它：

private static bool IsRegistered = false;
//...
public static System.Web.IHtmlString RenderJS(params string[] paths) {
    if (!IsRegistered)
        RegisterBundles();
    return Scripts.Render(paths);
}

并检查 RegisterBundles 中的注册状态：

public static void RegisterBundles() {
    if (IsRegistered)
        return;
    IsRegistered = true;
    //...;
}

唯一添加文件:

private static string[] CSSPths
    , JSPths;
public static void AddJS(params string[] pths) {
    if (JSPths == null)
        JSPths = new string[0];
    JSPths = MyNameSpace.Arrays.Merge(JSPths, pths
        .Select(elm => "~/" + elm.TrimStart('~', '/'))
        .Except(JSPths).ToArray());
}

编辑：
哈，我们可以从 UserControls（例如 NavBar 或菜单）的 OnInit 事件将文件添加到包中

将附加文件添加到 C# 脚本和 css 包

Adding additional files to C# script and css bundles

javascript

css

c#

optimization

minify