捆绑包以错误的顺序加载答案

【问题标题】：Bundle is loaded in the wrong order捆绑包以错误的顺序加载
【发布时间】：2014-03-08 19:35:15
【问题描述】：

在我的 _Layout 视图中，我包含以下脚本包：

bundles.Add(new ScriptBundle("~/bundles/js").Include(
                "~/Scripts/jquery.min.js",
                "~/Scripts/jquery-ui.min.js",
                "~/Scripts/bootstrap.min.js",
                "~/Scripts/jquery.flot.categories.js",
                "~/Scripts/jquery.flot.js",
                "~/Scripts/jquery.flot.min.js",
                "~/Scripts/jquery.flot.orderBars.js",
                "~/Scripts/jquery.flot.pie.js",
                "~/Scripts/jquery.flot.resize.js",
                "~/Scripts/graphtable.js",
                "~/Scripts/fullcalendar.min.js",
                "~/Scripts/chosen.jquery.min.js",
                "~/Scripts/autoresize.jquery.min.js",
                "~/Scripts/jquery.autotab.js",
                "~/Scripts/jquery.jgrowl_minimized.js",
                "~/Scripts/jquery.dataTables.min.js",
                "~/Scripts/jquery.stepy.min.js",
                "~/Scripts/jquery.validate.min.js",
                "~/Scripts/jquery.cookie.js",
                "~/Scripts/raphael.2.1.0.min.js",
                "~/Scripts/justgage.1.0.1.min.js",
                "~/Scripts/glisse.js",
                "~/Scripts/styleswitcher.js",
                "~/Scripts/moderniz.js",
                "~/Scripts/jquery.sparkline.min.js",
                "~/Scripts/slidernav-min.js",
                "~/Scripts/jquery.fancybox.js",
                "~/Scripts/main.js",
                "~/Scripts/application.js",
                "~/Scripts/excanvas.min.js",
                "~/Scripts/float.settings.infobox.js"
            ));

问题是；当我加载页面并查看网络流量时，我看到首先加载了 jquery-ui.min.js（在 jquery.min.js 之前）！

这是它们的加载顺序：

我认为脚本会按照我指定的顺序加载。我错了吗？如果是这样，我应该如何以正确的顺序加载它们？

编辑：我尝试按照此处所述添加自定义排序： http://stevescodingblog.co.uk/changing-the-ordering-for-single-bundles-in-asp-net-4/

但是在构建项目时出现以下错误：错误 1 'Namespace.AsIsBundleOrderer' 没有实现接口成员 'System.Web.Optimization.IBundleOrderer.OrderFiles(System.Web.Optimization.BundleContext, System.Collections.Generic.IEnumerable)'

【问题讨论】：

它可能是按照文件在Scripts文件夹中的顺序进行捆绑的。
@RayEatmon 脚本在我的脚本文件夹中按字母顺序自动排序。但是我不应该像上面尝试的那样以自定义方式对它们进行排序吗？
@JamieRomeo 即使您指定了顺序，它也会移动已知库，因此它绝对应该将 jQuery 放在首位。您能否发布脚本参考的 HTML？另外，至于您的其他错误，这是由于捆绑包中的最近更新所致。在方法中，IEnumerable<FileInfo> 已被替换为IEnumerable<BundleFile>。
我有这个 exact 问题，jquery 和 jquery-ui 以错误的顺序加载。在我的项目中，只要我将 jquery-ui 添加到项目模板创建的供应商包中，就会发生这种情况。因此，唯一涉及的 HTML 是默认 index.cshtml 文件中的 @Scripts.Render("~/Scripts/vendor")。
创建一个单独的包并使用两个 @Scripts.Render("~/Scripts/bundlename") 语句没有工作令我惊讶。这东西似乎彻底坏掉了。他们怎么会不知道呢？ jQuery-UI 非常常见！如果除了手动捆绑 jQuery 和 jQuery-UI 之外还有其他解决方法，我希望有人发布它。

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

【解决方案1】：

可能导致此问题的一些因素：

ASP.NET Web 优化框架的错误版本。更新到 1.1.3 或更高版本。
总是在符号名称之前处理显式名称。

显式命名依赖于符号命名库

Knockout-jqueryui.js 的名称中没有版本。它依赖于 jQuery 和 jQuery UI。两者的名称中都有版本。如果您使用 jQuery-{version} 之类的符号名称来引用这些库，因为 knockout-jqueryui 是显式命名的，它将在第一遍加载 - 在其依赖项之前。

要么显式命名版本，要么将版本号添加到依赖库名称中并使它们都具有符号性。

【讨论】：