捆绑渲染顺序与包含中的顺序不同

Question

我的 ASP MVC 应用程序配置了以下包。

bundles.Add(new ScriptBundle("~/Scripts/Core").Include(
                "~/Content/th/assets/global/plugins/jquery.min.js", // Should be first
                "~/Content/th/assets/global/plugins/bootstrap/js/bootstrap.min.js",
                "~/Content/th/assets/global/plugins/js.cookie.min.js",
                "~/Content/th/assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js",
                "~/Content/th/assets/global/plugins/jquery.blockui.min.js",
                "~/Content/th/assets/global/plugins/jquery-ui/jquery-ui.min.js", // Should be after jquery.min.js
                "~/Content/th/assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js",
                "~/Content/th/assets/global/plugins/bootstrap-select/js/bootstrap-select.min.js",
                "~/Content/th/assets/pages/scripts/components-bootstrap-select.js",
                "~/Content/th/assets/pages/scripts/portlet-draggable.min.js",
                "~/Content/th/assets/global/plugins/bootstrap-multiselect/js/bootstrap-multiselect.js",
                "~/Content/th/assets/global/plugins/po/jquery.webui-popover.min.js",
                "~/Content/th/assets/pages/scripts/components-bootstrap-multiselect.min.js",
                "~/Content/th/assets/pages/scripts/components-date-time-pickers.js"

为什么先输出jquery-ui.min.js？我如何防止这种行为产生 javascript 错误？

这是 @Scripts.Render("~/Scripts/Core")

的输出行

<script src="/Content/th/assets/global/plugins/jquery-ui/jquery-ui.min.js"></script>
<script src="/Content/th/assets/global/plugins/jquery.min.js"></script>
<script src="/Content/th/assets/global/plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="/Content/th/assets/global/plugins/js.cookie.min.js"></script>
<script src="/Content/th/assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js"></script>
<script src="/Content/th/assets/global/plugins/jquery.blockui.min.js"></script>
<script src="/Content/th/assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js"></script>
<script src="/Content/th/assets/global/plugins/bootstrap-select/js/bootstrap-select.min.js"></script>
<script src="/Content/th/assets/pages/scripts/components-bootstrap-select.js"></script>
<script src="/Content/th/assets/pages/scripts/portlet-draggable.min.js"></script>
<script src="/Content/th/assets/global/plugins/bootstrap-multiselect/js/bootstrap-multiselect.js"></script>
<script src="/Content/th/assets/global/plugins/po/jquery.webui-popover.min.js"></script>
<script src="/Content/th/assets/pages/scripts/components-bootstrap-multiselect.min.js"></script>
<script src="/Content/th/assets/pages/scripts/components-date-time-pickers.js"></script>

Answer 1

对于 MVC5 版本，要按照您的预期维护顺序，您可以使用以下命令

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;
    }
}

并且在捆绑时你提到 .ForceOrdered() 方法让它们按你指定的顺序出现。

bundles.Add(new ScriptBundle("~/Scripts/Core").Include(
                "~/Content/th/assets/global/plugins/jquery.min.js", // Should be first
                "~/Content/th/assets/global/plugins/bootstrap/js/bootstrap.min.js",
                "~/Content/th/assets/global/plugins/js.cookie.min.js",
                "~/Content/th/assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js",
                "~/Content/th/assets/global/plugins/jquery.blockui.min.js",
                "~/Content/th/assets/global/plugins/jquery-ui/jquery-ui.min.js", // Should be after jquery.min.js
                "~/Content/th/assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js",
                "~/Content/th/assets/global/plugins/bootstrap-select/js/bootstrap-select.min.js",
                "~/Content/th/assets/pages/scripts/components-bootstrap-select.js",
                "~/Content/th/assets/pages/scripts/portlet-draggable.min.js",
                "~/Content/th/assets/global/plugins/bootstrap-multiselect/js/bootstrap-multiselect.js",
                "~/Content/th/assets/global/plugins/po/jquery.webui-popover.min.js",
                "~/Content/th/assets/pages/scripts/components-bootstrap-multiselect.min.js",
                "~/Content/th/assets/pages/scripts/components-date-time-pickers.js")
.ForceOrdered());

捆绑渲染顺序与包含中的顺序不同

Bundles rendering order not same as in Include

c#

asp.net-mvc

bundle