C# 使脚本包包含另一个脚本包

C# 使脚本包包含另一个脚本包,c#,asp.net,asp.net-mvc,asp.net-mvc-3,asp.net-mvc-4,C#,Asp.net,Asp.net Mvc,Asp.net Mvc 3,Asp.net Mvc 4,假设我配置了这两个脚本包: bundles.Add(new ScriptBundle("~/Scripts/Bootstrap").Include( "~/Content/Scripts/jQuery/jquery-2.1.1.js", "~/Content/Scripts/Bootstrap/bootstrap.js")); bundles.Add(new ScriptBundle("~/Scripts/jQuery").Include( "~

假设我配置了这两个脚本包:

bundles.Add(new ScriptBundle("~/Scripts/Bootstrap").Include(
        "~/Content/Scripts/jQuery/jquery-2.1.1.js",
        "~/Content/Scripts/Bootstrap/bootstrap.js"));

bundles.Add(new ScriptBundle("~/Scripts/jQuery").Include(
        "~/Content/Scripts/jQuery/jquery-2.1.1.js"));
如您所见,
~/Scripts/Boostrap
使用jQuery JavaScript文件和引导文件。这是因为引导程序需要jQuery才能工作

另一方面,
~/Scripts/jQuery
仅由jQuery文件组成

我想要两个包,以防视图只需要jQuery而不需要引导

但是,我在这里复制代码,我定义jQuery JavaScript文件路径两次

有没有办法告诉
~/Scripts/Boostrap
捆绑包使用或“注入”另一个捆绑包

大概是这样的:

bundles.Add(new ScriptBundle("~/Scripts/Bootstrap").UseBundle("~/Scripts/jQuery").Include(
        "~/Content/Scripts/Bootstrap/bootstrap.js"));
bundles.Add(new ScriptBundle("~/Scripts/Home")
                .Include("~/Content/Scripts/jQuery/jquery-2.1.1.js",
                         "~/Content/Scripts/Bootstrap/bootstrap.js"
                         "~/Content/Scripts/Home.js"));

bundles.Add(new ScriptBundle("~/Scripts/Account")
                .Include("~/Content/Scripts/jQuery/jquery-2.1.1.js",
                         "~/Content/Scripts/Bootstrap/bootstrap.js"
                         "~/Content/Scripts/Account.js"));
var jQueryBundle = bundles.Add(new ScriptBundle("~/bundles/jquery").AsComposable()
                            .Include("~/Scripts/jquery-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryui").AsComposable()
                .UseBundle(jQueryBundle)
                .Include("~/Scripts/jquery-ui-{version}.js"));
使脚本包包含另一个脚本包

不直接使用绑定类

假设在您的场景中,业务部门决定只为每个请求向客户机发送一个包。您已经决定捆绑每个控制器所需的所有脚本(在这个神奇的世界中)。您可以从以下内容开始:

bundles.Add(new ScriptBundle("~/Scripts/Bootstrap").UseBundle("~/Scripts/jQuery").Include(
        "~/Content/Scripts/Bootstrap/bootstrap.js"));
bundles.Add(new ScriptBundle("~/Scripts/Home")
                .Include("~/Content/Scripts/jQuery/jquery-2.1.1.js",
                         "~/Content/Scripts/Bootstrap/bootstrap.js"
                         "~/Content/Scripts/Home.js"));

bundles.Add(new ScriptBundle("~/Scripts/Account")
                .Include("~/Content/Scripts/jQuery/jquery-2.1.1.js",
                         "~/Content/Scripts/Bootstrap/bootstrap.js"
                         "~/Content/Scripts/Account.js"));
var jQueryBundle = bundles.Add(new ScriptBundle("~/bundles/jquery").AsComposable()
                            .Include("~/Scripts/jquery-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryui").AsComposable()
                .UseBundle(jQueryBundle)
                .Include("~/Scripts/jquery-ui-{version}.js"));
然后意识到只需要一个字符串数组,您可以将代码转换为如下内容:

var commonScripts = new List<string>()
{
    "~/Content/Scripts/jQuery/jquery-2.1.1.js",
    "~/Content/Scripts/Bootstrap/bootstrap.js"
};

var homeScripts = new List<string>()
{
  "~/Content/Scripts/Home.js"
};

bundles.Add(new ScriptBundle("~/bundles/home/")
                .Include(commonScripts.Concat(homeScripts).ToArray()));

var accountScripts = new List<string>()
{
  "~/Content/Scripts/Account.js"
};

bundles.Add(new ScriptBundle("~/bundles/account/")
                .Include(commonScripts.Concat(accountScripts).ToArray()));

就个人而言,我不会将jQuery或BootStrap包含在捆绑包中,因为它们可以从许多在线CDN免费获得;一种方法,我使用较少的带宽,而B客户端可能已经下载了我需要的脚本(无论如何,CDNs都存在于普通脚本/样式中)。

< P>你也可以考虑创建一个<代码>复合包> /Cord>包装器类,允许你用<代码> UseBundle(SouthBub)< /Cord>语法组成捆绑包。 例如,以下类和扩展方法:

public class ComposableBundle<T> where T : Bundle
{
    private T _bundle;
    private List<string> _virtualPaths = new List<string>();

    public ComposableBundle(T bundle)
    {
        _bundle = bundle;
    }

    public string[] VirtualPaths
    {
        get { return _virtualPaths.ToArray(); }
    }

    public T Bundle
    {
        get { return _bundle; }
    }

    public ComposableBundle<T> Include(params string[] virtualPaths)
    {
        _virtualPaths.AddRange(virtualPaths);
        _bundle.Include(virtualPaths);
        return this;
    }

    public ComposableBundle<T> UseBundle(ComposableBundle<T> bundle)
    {
        _bundle.Include(bundle.VirtualPaths.ToArray());
        return this;
    }
}

public static class BundleExtensions
{
    public static ComposableBundle<T> AsComposable<T>(this T bundle) where T : Bundle
    {
        return new ComposableBundle<T>(bundle);
    }

    public static ComposableBundle<T> Add<T>(this BundleCollection bundles, ComposableBundle<T> bundle) where T: Bundle
    {
        bundles.Add(bundle.Bundle);
        return bundle;
    }
}

为什么不让jQuery捆绑包仅为jQuery而引导捆绑包仅为引导捆绑包呢。在您看来,包括jQuery,如有必要,引入引导包。除了在HTML中保存一个脚本标记之外,我看不出将jquery包含在两个单独的包中会给您带来什么真正的好处。@Tommy我可以这样做,客户机再做一个请求的工作几乎不值得注意,但如果有更优的方法来完成我想要的任务,而且仍然让客户端只发送一个对两个脚本的请求,这将是非常棒的。不幸的是,这里没有什么可以说的,除了,不,这是不可能的。无法在另一个bundle中引用bundle。从程序员的角度来看,
我想要两个bundle,以防一个视图只需要jQuery而不需要Bootstrap
听起来完全合乎逻辑,因为我们对缓存一无所知。一旦涉及到缓存,每个视图绑定的想法实际上比第一个请求之后的每个视图多个脚本的性能更差(通常情况下)。包装器很好,现在我也想使用post订购绑定文件,如何将两者混合?我写这篇文章已经有一段时间了,但我认为您应该能够添加另一个fluent方法
UseOrderer(orderer)
,在其中设置
\u bundle.order
。我建议您尝试一下,如果问题不起作用,请打开一个新问题。感谢您的回答,我尝试过,但我遇到了错误。您的问题是
UseBundle
而不是
includeHandle
?我假设您可以将
UseBundle
链接起来,这对我来说意味着您希望继续使用现有的短语(
Include
)。而且,这并不重要,
ComposableBundle.UseBundle()
在数组上调用
.ToArray()