如何指定明确的ScriptBundle包含顺序？

Question

我正在尝试MVC4 System.Web.Optimization 1.0 ScriptBundle功能。我有以下配置：public class BundleConfig{    public static void RegisterBundles(BundleCollection bundles)    {        // shared scripts        Bundle canvasScripts =            new ScriptBundle(BundlePaths.CanvasScripts)                .Include("~/Scripts/modernizr-*")                .Include("~/Scripts/json2.js")                .Include("~/Scripts/columnizer.js")                .Include("~/Scripts/jquery.ui.message.min.js")                .Include("~/Scripts/Shared/achievements.js")                .Include("~/Scripts/Shared/canvas.js");        bundles.Add(canvasScripts);    }}和以下视图：<script type="text/javascript" src="@Scripts.Url(BundlePaths.CanvasScripts)"></script>哪里BundlePaths.CanvasScripts是"~/bundles/scripts/canvas"。它呈现如下：<script type="text/javascript" src="/bundles/scripts/canvas?v=UTH3XqH0UXWjJzi-gtX03eU183BJNpFNg8anioG14_41"></script>到目前为止一切顺利，但~/Scripts/Shared/achievements.js捆绑源中的第一个脚本除外。它取决于之前包含的每个脚本ScriptBundle。我如何确保它遵循我向包中添加包含语句的顺序？更新资料这是一个相对较新的ASP.NET MVC 4应用程序，但它引用了优化框架预发行包。我删除了它，并从http://nuget.org/packages/Microsoft.AspNet.Web.Optimization添加了RTM包。对于在web.config中具有debug = true的RTM版本，@Scripts.Render("~/bundles/scripts/canvas")将以正确的顺序呈现各个脚本标签。在web.config中使用debug = false时，合并的脚本首先具有Achievements.js脚本，但是由于它是稍后调用的函数定义（对象构造函数），因此运行时没有错误。缩小器也许足够聪明以找出依赖关系？我还尝试了IBundleOrdererDarin Dimitrov建议的RTM在两个调试选项下的实现，并且其表现相同。因此，缩小版本与我期望的顺序不符，但可以正常工作。

Answer 1

您可以编写一个自定义的捆绑IBundleOrderer包排序器（），以确保捆绑包包含在您注册它们的顺序中：

public class AsIsBundleOrderer : IBundleOrderer

{

    public virtual IEnumerable<FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files)

    {

        return files;

    }

}

接着：

public class BundleConfig

{

    public static void RegisterBundles(BundleCollection bundles)

    {

        var bundle = new Bundle("~/bundles/scripts/canvas");

        bundle.Orderer = new AsIsBundleOrderer();

        bundle

            .Include("~/Scripts/modernizr-*")

            .Include("~/Scripts/json2.js")

            .Include("~/Scripts/columnizer.js")

            .Include("~/Scripts/jquery.ui.message.min.js")

            .Include("~/Scripts/Shared/achievements.js")

            .Include("~/Scripts/Shared/canvas.js");

        bundles.Add(bundle);

    }

}

并且在您看来：

@Scripts.Render("~/bundles/scripts/canvas")

Answer 2

谢谢你达林。我添加了扩展方法。

internal class AsIsBundleOrderer : IBundleOrderer

{

    public virtual IEnumerable<FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files)

    {

        return files;

    }

}

internal static class BundleExtensions

{

    public static Bundle ForceOrdered(this Bundle sb)

    {

        sb.Orderer = new AsIsBundleOrderer();

        return sb;

    }

}

用法

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(

                    "~/Scripts/jquery-{version}.js",

                    "~/Scripts/jquery-migrate-{version}.js",

                    "~/Scripts/jquery.validate.js",

                    "~/Scripts/jquery.validate.messages_fr.js",

                    "~/Scripts/moon.jquery.validation-{version}.js",

                    "~/Scripts/jquery-ui-{version}.js"

                    ).ForceOrdered());