使脚本包包括另一个脚本包 [英] Make a script bundle include another script bundle

查看:152
本文介绍了使脚本包包括另一个脚本包的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

让我们假设我已经配置这两个脚本包:

  bundles.Add(新ScriptBundle(〜/脚本/引导)。包括(
        〜/内容/脚本/ jQuery的/ jQuery的-2.1.1.js
        〜/内容/脚本/引导/ bootstrap.js));bundles.Add(新ScriptBundle(〜/脚本/ jQuery的)。包括(
        〜/内容/脚本/ jQuery的/ jQuery的-2.1.1.js));

正如你所看到的,〜/脚本/自举使用一个jQuery JavaScript文件和引导的。这是因为,引导1需要jQuery来工作。

在另一方面,〜/脚本/ jQuery的仅由jQuery的文件。

我想有两个包袱的情况下,一个视图只需要jQuery和不引导。

不过,我在这里复制code,我定义了jQuery JavaScript文件路径的两次

有没有办法告诉〜/脚本/自举捆绑使用或注入另一个包?

事情是这样的:

  bundles.Add(新ScriptBundle(〜/脚本/引导)。UseBundle(〜/脚本/ jQuery的)。包括(
        〜/内容/脚本/引导/ bootstrap.js));


解决方案

  

请一个脚​​本包包括另一个脚本包


不直接使用捆绑类。

让你的场景中,该企业决定只发送一个包到客户端为每个请求说。你决定需要捆绑每个控制器(在这个神奇的世界)的所有脚本。你可能会像这样开始:

  bundles.Add(新ScriptBundle(〜/脚本/家庭)
                .INCLUDE(〜/内容/脚本/ jQuery的/ jQuery的-2.1.1.js
                         〜/内容/脚本/引导/ bootstrap.js
                         〜/内容/脚本/ Home.js));bundles.Add(新ScriptBundle(〜/脚本/账户)
                .INCLUDE(〜/内容/脚本/ jQuery的/ jQuery的-2.1.1.js
                         〜/内容/脚本/引导/ bootstrap.js
                         〜/内容/脚本/ Account.js));

然后意识到 .INCLUDE(字符串[])只是需要字符串数组,可以你code到是这样的:

  VAR commonScripts =新的List<串GT;()
{
    〜/内容/脚本/ jQuery的/ jQuery的-2.1.1.js
    〜/内容/脚本/引导/ bootstrap.js
};VAR homeScripts =新的List<串GT;()
{
  〜/内容/脚本/ Home.js
};bundles.Add(新ScriptBundle(〜/包/家庭/)
                .INCLUDE(commonScripts.Concat(homeScripts).ToArray()));VAR accountScripts =新的List<串GT;()
{
  〜/内容/脚本/ Account.js
};bundles.Add(新ScriptBundle(〜/包/帐号/)
                .INCLUDE(commonScripts.Concat(accountScripts).ToArray()));

我不推荐这种解决方案背后的商业原因,但我认为,解决它也同样可以用来解决你的问题的逻辑。

如果你认为你将可能有重复,你还可以:

  .INCLUDE(commonScripts.Concat(accountScripts)
                                      。不同()
                                      .ToArray()));

我个人不包括jQuery的或者引导成束,因为它们可以从许多的CDN网上免费哪些; A表示我用我的少的带宽,而B客户可能已经下载了我需要的脚本(CDN的共同脚本/风格存在的原因是这样)。

Let's suppose I have these two script bundles configured:

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"));

As you can see, ~/Scripts/Boostrap uses a jQuery JavaScript file and a Bootstrap one. This is because the Bootstrap one requires jQuery to work.

On the other hand, ~/Scripts/jQuery is composed of only the jQuery file.

I want to have two bundles in case a view only needs jQuery and not Bootstrap.

However, I am replicating code here, I am defining the jQuery JavaScript file path twice.

Is there a way to tell the ~/Scripts/Boostrap bundle to use or "inject" another bundle?

Something like this:

bundles.Add(new ScriptBundle("~/Scripts/Bootstrap").UseBundle("~/Scripts/jQuery").Include(
        "~/Content/Scripts/Bootstrap/bootstrap.js"));

解决方案

Make a script bundle include another script bundle

Not directly using the Bundling class.

Let say in your scenario that the business decides to only send a single bundle to the client for every request. You've decided to bundle all the scripts needed for each controller (in this magical world). You might start off with something like this:

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"));

Then realizing that .Include(string[]) simply takes an array of string, you could DRY your code into something like:

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()));

I don't recommend the business reasons behind this solution, but I think the logic that solves it could be used similarly to solve your problem.

If you think you're going to possibly have duplicates you could also:

                .Include(commonScripts.Concat(accountScripts)
                                      .Distinct()
                                      .ToArray()));

Personally I wouldn't include jQuery or BootStrap in bundles, as they are available from many CDNs online for free which; A means I use less of my bandwidth, and B the client may have already downloaded the scripts I need (The reasons CDNs exist for common scripts/styles anyway).

这篇关于使脚本包包括另一个脚本包的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆