ASP.NET MVC - 捆绑配置顺序

IT技术 javascript asp.net asp.net-mvc
2021-03-18 14:43:21

我正在尝试在我的 ASP.NET MVC 5 应用程序中使用特定的语言环境 (es-CL)。我有以下几点：

  1. 将 web.config uiculture 和culture 更改为“es-CL”
  2. 安装了Globalize和jQuery.Validation.Globalize包
  3. 在我的视图中更改了默认语言： <html lang="es-cl">
  4. 创建了一个新的 Bundle 并包含在适当的视图中。

在BundleConfig.cs 中：

bundles.Add(new ScriptBundle("~/bundles/jqueryval")
    .Include("~/Scripts/jquery.validate.js")
    .Include("~/Scripts/jquery.validate.unobtrusive.js"));

bundles.Add(new ScriptBundle("~/bundles/globalization")
    .Include("~/Scripts/globalize/globalize.js")
    .Include("~/Scripts/globalize/cultures/globalize.culture.es-CL.js")
    .Include("~/Scripts/jquery.validate.globalize.js"));

在适当的视图中：

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/globalization")
}

但是，生成的源代码如下：

<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>

<script src="/Scripts/jquery.validate.globalize.js"></script>
<script src="/Scripts/globalize/globalize.js"></script>
<script src="/Scripts/globalize/cultures/globalize.culture.es-CL.js"></script>

请注意jquery.validate.globalize.js脚本是在globalize.js之前加载的，这不是我想要的。

为什么会这样？是否可以依赖单个包中的包含顺序，或者我是否被迫将这个脚本放在不同的包中并在我的视图中指定它？

3个回答

默认情况下，带有通配符的名称的捆绑顺序是按字母顺序排列的（如评论中所指出的）。然而，它也根据它认为的依赖树是jQuery什么来排序，并且脚本似乎被排到了顶部。您需要创建一个对象来实现IBundleOrder：

class NonOrderingBundleOrderer : IBundleOrderer
{
    public IEnumerable<FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files)
    {
        return files;
    }
}

这可以防止默认排序。现在使用它：

var bundle = new ScriptBundle("~/bundles/globalization")
    .Include("~/Scripts/globalize/globalize.js")
    .Include("~/Scripts/globalize/cultures/globalize.culture.es-CL.js")
    .Include("~/Scripts/jquery.validate.globalize.js");

bundle.Orderer = new NonOrderingBundleOrderer();

bundles.Add(bundle);

参考：http : //stevescodingblog.co.uk/changed-the-ordering-for-single-bundles-in-asp-net-4/

如需进一步阅读，对 MikeSmithDev 问题的回答提供了对流行脚本库默认排序的进一步了解：

捆绑包中的文件排序 - 已知的库有哪些？

不是挑剔，但是当您使用通配符之类的东西时，“默认情况下，捆绑顺序是按字母顺序排列的”是正确的……当您指定顺序时，就像他一样，应该使用他的顺序。我只能假设捆绑器正在移动已知的文件类型，而忽略了他的命令。
2021-04-25 14:43:21
看起来捆绑器也使用一些关于依赖关系的逻辑进行排序。它认为这jquery.validate.globalize.js是其他两个所必需的。来自参考文献：“[捆绑器] 甚至会自动将已知的框架 javascript 文件首先放入捆绑包中，例如 jQuery 或 Prototype 脚本，以确保它们在您自己的使用其类型的代码被执行之前运行”
2021-05-07 14:43:21
具体顺序是： jquery.js jquery-min.js jquery-* jquery-ui* jquery.ui* jquery.unobtrusive* jquery.validate* modernizr-* dojo.* mootools-core* mootools-*prototype.jsprototype- * scriptaculous-* ext.js ext-*
2021-05-07 14:43:21
这种存在的事实让我大吃一惊，因为它是多么愚蠢。真的.. 打包程序比我输入的更清楚如何对我的依赖项进行排序？Gulp.js（甚至 Grunt）FTW！
2021-05-07 14:43:21
这就是编程不好玩的地方。为什么 VS 使这变得复杂？
2021-05-20 14:43:21

在 MVC 5 的最后一个版本（2014 年 10 月 27 日）中，你应该使用这个类：

class AsIsBundleOrderer : IBundleOrderer
{
    public IEnumerable<BundleFile> OrderFiles(BundleContext context, IEnumerable<BundleFile> files)
    {
        return files;
    }
}

并像其他响应一样创建包：

var bundle = new ScriptBundle("~/bundles/globalization")
.Include("~/Scripts/globalize/globalize.js")
.Include("~/Scripts/globalize/cultures/globalize.culture.es-CL.js")
.Include("~/Scripts/jquery.validate.globalize.js");

bundle.Orderer = new AsIsBundleOrderer();

bundles.Add(bundle);
我只是用 MVC 5.2.3 测试它，tehres 是 Orderer 属性。
2021-04-28 14:43:21
没有 Orderer 属性。我正在使用 MVC 5.2.x
2021-05-15 14:43:21
我在哪里可以找到这些信息？你能提供一个链接吗？
2021-05-16 14:43:21
我只是尝试对这个问题使用当前响应的方法，但我发现我的 selkf 在 ASP.NET MVC 5 中有错误，所以我检查了 IBundleOrderer 接口并进行了更改
2021-05-19 14:43:21

为了减少创建bundle时的代码，我建议你创建一个扩展方法。

需要基础设施类：

class NonOrderingBundleOrderer : IBundleOrderer
{
    public IEnumerable<BundleFile> OrderFiles(BundleContext context, IEnumerable<BundleFile> files)
    {
        return files;
    }
}


static class BundleExtentions
{
    public static Bundle NonOrdering(this Bundle bundle)
    {
        bundle.Orderer=new NonOrderingBundleOrderer();
        return bundle;
    }
}

现在只需像这样使用它：

一键搞定😎

bundles.Add(new ScriptBundle("~/bundles/jqueryval")
               .NonOrdering()
               .Include(
                    "~/Scripts/globalize/globalize.js",
                    "~/Scripts/globalize/cultures/globalize.culture.es-CL.js",
                    //...
                );
不错的思路！
2021-04-21 14:43:21
其它你可能感兴趣的问题
上一篇将javascript字符串转换为html对象 下一篇Google Maps Api v3 - getBounds 未定义