MVC4 StyleBundle 未按正确的顺序呈现包

2024-02-05

我正在尝试渲染一组 css 文件,但输出的顺序错误。我已经尝试过解决方案@MVC4 Beta 缩小和捆绑:在浏览器中排序文件和调试 https://stackoverflow.com/questions/9657412/mvc4-beta-minification-and-bundling-ordering-files-and-debugging-in-browser,但这没有帮助。这是捆绑包:

bundles.Add(new StyleBundle("~/stylesheet")
    .Include("~/css/main.css")
    .Include("~/css/mvc.css")
    .Include("~/js/jquery.thickbox.css")
    .Include("~/js/jquery.rating.css")
    .Include("~/css/ProductListing.css")
    .Include("~/css/dropdown/dropdown.css")
    .Include("~/css/dropdown/dropdown.vertical.css")
    .Include("~/js/fancybox/jquery.fancybox-1.3.1.css")
    .Include("~/css/scartpopup.css")
    .Include("~/css/ShoppingCart.css")
    .Include("~/css/ceebox.css")
    .Include("~/css/tooltip.css")
    .Include("~/css/recent_blog_posts.css")
    .Include("~/css/ProductDetail.css")
    .Include("~/css/jquery-ui-1.7.3.custom.css")
    .Include("~/css/filter_box.css")
    .Include("~/css/custom_page.css")
    .Include("~/css/Checkout.css")
    .Include("~/css/CheckoutButton.css")
);

这是结果,您可以看到 jquery-ui 位于顶部。

<link href="/css/jquery-ui-1.7.3.custom.css" rel="stylesheet"/>
<link href="/css/main.css" rel="stylesheet"/>
<link href="/css/mvc.css" rel="stylesheet"/>
<link href="/js/jquery.thickbox.css" rel="stylesheet"/>
<link href="/js/jquery.rating.css" rel="stylesheet"/>
<link href="/css/ProductListing.css" rel="stylesheet"/>
<link href="/css/dropdown/dropdown.css" rel="stylesheet"/>
<link href="/css/dropdown/dropdown.vertical.css" rel="stylesheet"/>
<link href="/js/fancybox/jquery.fancybox-1.3.1.css" rel="stylesheet"/>
<link href="/css/scartpopup.css" rel="stylesheet"/>
<link href="/css/ShoppingCart.css" rel="stylesheet"/>
<link href="/css/ceebox.css" rel="stylesheet"/>
<link href="/css/tooltip.css" rel="stylesheet"/>
<link href="/css/recent_blog_posts.css" rel="stylesheet"/>
<link href="/css/ProductDetail.css" rel="stylesheet"/>
<link href="/css/filter_box.css" rel="stylesheet"/>
<link href="/css/custom_page.css" rel="stylesheet"/>
<link href="/css/Checkout.css" rel="stylesheet"/>
<link href="/css/CheckoutButton.css" rel="stylesheet"/>

如何确保样式表以正确的顺序呈现?


捆绑不应该以完全相同的顺序渲染 CSS 文件,它遵循不同的逻辑。如果您需要按照定义呈现它们,那么您应该创建一个自定义IBundleOrderer http://msdn.microsoft.com/en-us/library/system.web.optimization.ibundleorderer.aspx并将其设置为捆绑包作为所需的 Orderer:

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

And

var bundle = new StyleBundle("~/stylesheet");
bundle.Orderer = new AsDefinedBundleOrderer();
bundles.Add(bundle);

那么这不会对列表执行任何操作,因此 Render 将以完全相同的顺序渲染它们。

默认排序更新

捆绑使用的概念IBundleOrderer对 a 中的项目进行排序Bundle. The Bundle类有它的Orderer属性看起来像这样:

public IBundleOrderer Orderer
{
  get
  {
    if (this._orderer == null)
      return (IBundleOrderer) DefaultBundleOrderer.Instance;
    else
      return this._orderer;
  }
  set
  {
    this._orderer = value;
    this.InvalidateCacheEntries();
  }
}

所以默认排序者实际上是DefaultBundleOrderer直到您用自定义排序器覆盖它。

The IBundleOrderer有以下签名:

public interface IBundleOrderer
{
  IEnumerable<FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files);
}

The DefaultBundleOrderer执行此命令的文件由BundleContext,这是实现的一个片段OrderFiles:

  foreach (BundleFileSetOrdering ordering in (IEnumerable<BundleFileSetOrdering>) context.BundleCollection.FileSetOrderList)
    DefaultBundleOrderer.AddOrderingFiles(ordering, (IEnumerable<FileInfo>) list, fileMap, foundFiles, result);

因此,不同的结果就会发生。这当然不是随机排序算法:) 规则定义在BUndleCollection class:

public static void AddDefaultFileOrderings(IList<BundleFileSetOrdering> list)
{
  if (list == null)
    throw new ArgumentNullException("list");
  BundleFileSetOrdering bundleFileSetOrdering1 = new BundleFileSetOrdering("css");
  bundleFileSetOrdering1.Files.Add("reset.css");
  bundleFileSetOrdering1.Files.Add("normalize.css");
  list.Add(bundleFileSetOrdering1);
  BundleFileSetOrdering bundleFileSetOrdering2 = new BundleFileSetOrdering("jquery");
  bundleFileSetOrdering2.Files.Add("jquery.js");
  bundleFileSetOrdering2.Files.Add("jquery-min.js");
  bundleFileSetOrdering2.Files.Add("jquery-*");
  bundleFileSetOrdering2.Files.Add("jquery-ui*");
  bundleFileSetOrdering2.Files.Add("jquery.ui*");
  bundleFileSetOrdering2.Files.Add("jquery.unobtrusive*");
  bundleFileSetOrdering2.Files.Add("jquery.validate*");
  list.Add(bundleFileSetOrdering2);
  BundleFileSetOrdering bundleFileSetOrdering3 = new BundleFileSetOrdering("modernizr");
  bundleFileSetOrdering3.Files.Add("modernizr-*");
  list.Add(bundleFileSetOrdering3);
  BundleFileSetOrdering bundleFileSetOrdering4 = new BundleFileSetOrdering("dojo");
  bundleFileSetOrdering4.Files.Add("dojo.*");
  list.Add(bundleFileSetOrdering4);
  BundleFileSetOrdering bundleFileSetOrdering5 = new BundleFileSetOrdering("moo");
  bundleFileSetOrdering5.Files.Add("mootools-core*");
  bundleFileSetOrdering5.Files.Add("mootools-*");
  list.Add(bundleFileSetOrdering5);
  BundleFileSetOrdering bundleFileSetOrdering6 = new BundleFileSetOrdering("prototype");
  bundleFileSetOrdering6.Files.Add("prototype.js");
  bundleFileSetOrdering6.Files.Add("prototype-*");
  bundleFileSetOrdering6.Files.Add("scriptaculous-*");
  list.Add(bundleFileSetOrdering6);
  BundleFileSetOrdering bundleFileSetOrdering7 = new BundleFileSetOrdering("ext");
  bundleFileSetOrdering7.Files.Add("ext.js");
  bundleFileSetOrdering7.Files.Add("ext-*");
  list.Add(bundleFileSetOrdering7);
}

所以当你从Application_Start:

BundleConfig.RegisterBundles(BundleTable.Bundles);

实际上你传递了默认值BundleCollection库中定义。

所以我们有BundleFileSetOrdering实例一一传递到:

private static void AddOrderingFiles(BundleFileSetOrdering ordering, IEnumerable<FileInfo> files, Dictionary<string, HashSet<FileInfo>> fileMap, HashSet<FileInfo> foundFiles, List<FileInfo> result)
{
  foreach (string key in (IEnumerable<string>) ordering.Files)
  {
    if (key.EndsWith("*", StringComparison.OrdinalIgnoreCase))
    {
      string str = key.Substring(0, key.Length - 1);
      foreach (FileInfo fileInfo in files)
      {
        if (!foundFiles.Contains(fileInfo) && fileInfo.Name.StartsWith(str, StringComparison.OrdinalIgnoreCase))
        {
          result.Add(fileInfo);
          foundFiles.Add(fileInfo);
        }
      }
    }
    else if (fileMap.ContainsKey(key))
    {
      List<FileInfo> list = new List<FileInfo>((IEnumerable<FileInfo>) fileMap[key]);
      list.Sort((IComparer<FileInfo>) FileInfoComparer.Instance);
      foreach (FileInfo fileInfo in list)
      {
        if (!foundFiles.Contains(fileInfo))
        {
          result.Add(fileInfo);
          foundFiles.Add(fileInfo);
        }
      }
    }
  }
}

结论

如果我们想简化这个过程,我们可以说该库更喜欢某种类型的文件,并在发现多种可能性时对其他文件进行一些排序。这是大多数时候的预期行为,但正如您所看到的,它很容易被AsDefinedBundleOrderer因此它对给定的文件集不执行任何操作,因此顺序保持原始顺序。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

MVC4 StyleBundle 未按正确的顺序呈现包 的相关文章

  • MVC4:jQuery 验证不显眼的本机工作不正确

    我的 MVC4 Web 应用程序是在 Umbraco 7 上构建的 我已经安装了以下 nuget 软件包 jQuery 1 10 2 jQuery Validation 1 11 1 jQuery Validation Unobtrusiv
  • 在启用 LowercaseUrls 的情况下保留路由参数中的大小写

    我在用routes LowercaseUrls true 在我的 MVC 4 应用程序中 它运行得很好 但是 参数也会变成小写 所以如果我有一条像 routes MapRoute name MyController url foo hash
  • Chrome“请匹配请求的格式”验证消息

    我正在研究 HTML 5 验证和本地化 并设法让一些代码正常工作 使我能够本地化 HTML 5 验证错误消息 见下文 我的问题是 在 Chrome 中 当与模式匹配时 您仍然会弹出英语 或者我猜您 Chrome 设置的任何语言 的弹出窗口
  • ASP.NET MVC 4 RC 与温莎城堡

    我正在查看 ASP NET MVC 4 RC 但找不到 DefaultHttpControllerFactory 甚至 IHttpControllerFactory 来允许我选择的 IoC 容器 Castle Windsor 连接到 Web
  • 如何在MVC中获取控制器中的下拉值

    我使用递归函数使用字符串列表绑定下拉列表我的下拉菜单具有类似的值 家 首页 gt gt 厨房 首页 gt gt 厨房 gt gt ABC 我想在数据库中使用相同的下拉值 ABC 这是我的查看代码 ViewBag Title Createne
  • MVC4 - ContextDependentView - 是什么意思?

    我刚刚开始使用 MVC4 我看到的第一个操作方法有一些新内容 我查了一下互联网 找不到任何关于此的信息 public ActionResult LogOn return ContextDependentView 有谁知道 ContextDe
  • 在 MVC4 中使函数异步时 HttpContext.Current null

    我目前正在 VS2010 SP1 中开发 MVC4 我做了其中一个功能 控制器类异步 作为其中的一部分 我制作了控制器类 派生自 AsyncController 并添加了以下两个方法 参见代码部分 1 和 2 下 一种以 Async 结尾的
  • 将 javascript 变量作为参数传递给 @url.Action()

    是否可以将javascript变量作为参数传递给 url Action 因为据我所知可能存在服务器和客户端问题 我的要求是我必须根据过滤器下载文件 并进行ajax调用不适用于下载文件 所以我对 url Action 进行了编码 但无法实现这
  • 将 viewbag 从操作控制器传递到部分视图

    我有一个带有部分视图的 mvc 视图 控制器中有一个 ActionResult 方法 它将返回 PartialView 因此 我需要将 ViewBag 数据从 ActionResult 方法传递到 Partial View 这是我的控制器
  • ModelBinder 验证在使用反射的 getter 上中断

    我遇到了一个似乎与反射和模型绑定验证有关的问题 并且FormatterParameterBinding ExecuteBindingAsync 特别是 虽然我可以使用方法来做我想做的事情 但如果我可以使用属性 我会更喜欢它 在这里 我正在寻
  • 如何在 Asp.NET MVC 中使用 RedirectToAction() 传递多个对象?

    我想使用redirectToAction 方法传递多个对象 下面是我重定向到的操作结果 public ActionResult GetEmployees Models Department department Models Categor
  • 使用 CSS 和 JQuery 创建组织结构图结构

    I was checking on stack forum Trees in Twitter Bootstrap https stackoverflow com questions 11167628 trees in twitter boo
  • Ajax.ActionLink 和确认对话框

    我有一些问题 Ajax ActionLink 我想显示确认对话框 是的 我知道我可以这样做 Ajax ActionLink Do it Delete new AjaxOptions Confirm Are you sure 但我想要有自己的
  • MVC 对元素组强制进行 jQuery 验证

    我正在使用 MVC 4 设计的表单具有多个 DIVS 每个 DIVS 中有许多元素 我的目标是在用户填写字段时打开 关闭 DIVS 但是 我想对每个 DIV 而不是整个表单使用不显眼的验证 不单独检查每个元素是否可能 也许使用 DIV ID
  • MVC 5 动态行与 BeginCollectionItem

    单击按钮时向表添加 删除行的最佳方法是什么 我需要从子类属性创建的行 子类是主类 模型中的列表 当前有一个视图 模型是 MyMain 它使用 RenderPartial 引用部分视图 分部视图显示模型的属性 一个名为 MyChild 的类
  • ASP.Net MVC 4 通用主要难点

    我正在开发一个ASP NET MVC 4Web应用程序 以前我的 MVC 应用程序是使用MVC 3和这个新的MVC 4我刚刚复制 重复使用了我的应用程序认证和授权码从以前的应用程序 当用户登录我的网站时 我会执行以下操作 账户控制器 pub
  • MVC 4 授权属性无法识别 ASP.Net 3.5 中的表单身份验证

    我正在为之前创建过 ASP Net 3 5 VS 2008 应用程序的客户端创建一个新的 MVC 4 应用程序 我创建了一个网关应用程序来启动其他几个 ASP Net 3 5 Web 应用程序 网关应用程序处理登录和表单身份验证票证 只要所
  • _Layout.cshtml无法直接请求,因为它调用了“RenderBody”方法

    我使用属性来路由 这是否相关 我不知道 当我不使用 Route 属性时 共享控制器中的 Layaout 操作不起作用 但页面正在呈现 public class SharedController Controller GET Shared A
  • SignalR 更新无法在 Chrome 上正常运行

    我创建了一个带有 SignalR 通知的 ASP MVC 4 应用程序 我在本地以调试模式运行它 并通过 IIS 发布在服务器上运行它 使用 Internet Explorer 11 时 这基本上可以正常工作 稍后解释 HTML1300 N
  • 如何将电子邮件类型的输入应用到 Asp.net MVC3 Razor 中的 HTML Helper

    如何将电子邮件类型的输入应用到 Asp net MVC3 Razor 中的 HTML Helper 例如

随机推荐

  • 将 MS Access 表单和类/模块递归导出到文本文件?

    我在一个古老的留言板上发现了一些代码 它很好地从类 模块和表单中导出了所有 VBA 代码 见下文 Option Explicit Option Compare Database Function SaveToFile Save the co
  • Java 8 流式添加两个或多个列表中的值

    我试图进入 Java 8 并了解流和 lambda 来解决各种问题 但陷入了这个特定的问题 我通常使用 forEach 并将值存储在 Map 中来解决 您将如何编写代码来使用 Java 8 中的新功能获取预期列表 List
  • 具有选择条件的 pandas 数据框中的高效最大选择

    我有一个带有列的 pandas 数据框 除其他外 user id and start time 我想高效且易读地找到与每个用户的最大值关联的所有行start time 例如 如果这是我的数据 user id start time A B C
  • 批量传输和 Android USB API

    我有一个程序 我尝试通过 USB 将我的 Android 设备连接到网络摄像头 我在一些事情上遇到了麻烦 即正确传输数据 我尝试过使用bulkTransfer 但似乎无法识别它的使用情况 我一直在尝试寻找可能对我有帮助的例子 例如here
  • 使用 Scala 生成代码

    在 Scala 中使用 SBT 工具链时 是否可以编写一个任务来读取项目源代码的特殊部分以在编译时生成 scala 代码 有什么想法甚至文章 教程吗 我正在寻找与 Template Haskell 非常相似的东西 环树者 scala htt
  • Laravel Lighthouse 中的身份验证

    在我的 graphql API 中 我必须通过两个不同的因素来授权对字段的请求 用户是否有权访问数据或者数据是否属于用户 例如 用户应该能够看到自己的用户数据 并且所有具有管理员权限的用户也应该能够看到这些数据 我想保护这些字段 以便具有不
  • RedisTemplate过期不起作用

    我正在尝试测试 RedisTemplate 中的过期方法 例如 我将会话存储在 redis 中 然后尝试检索会话并检查值是否相同 对于过期会话 我使用 redisTemplate 的 expire 方法 对于获取过期会话 我使用 getEx
  • NuGet System.Drawing.Common .NET 6 CA1416 此调用站点可在所有平台上访问。 “Image.FromStream(Stream)”仅支持:“windows”

    升级 NuGetSystem Drawing Common到 6 0 0 会导致以下错误 CA1416 此调用站点可在所有平台上访问 仅在 Windows 上支持 Image FromStream Stream https www nuge
  • 无法将整数类型转换为 uuid

    我试着跑python3 manage py migrate 但我得到了这个error File Library Frameworks Python framework Versions 3 8 lib python3 8 site pack
  • 特定于页面的 CSS 规则 - 将它们放在哪里?

    通常 当我设计网站时 我需要将特定样式应用于页面上的特定元素 并且我绝对确定它只会应用于该页面上的该元素 例如绝对定位的按钮 或者其他的东西 我不想诉诸内联样式 因为我倾向于同意样式与标记分开的理念 所以我发现自己在内部争论将样式定义放在哪
  • Pandas 重新映射到列中的范围

    我有一个带有 id s 列的 DataFrame 可以包含重复项 gt gt gt df user id head Out 3 0 2134 1 1234 2 4323 3 25434 4 1234 Name user id dtype i
  • Roxygen2 - 如何 @export 引用类生成器?

    例如 假设我有以下包称为Test我想导出课程A In R Test R docType package import methods exportClass A A lt setRefClass A methods list foo ide
  • ASP.NET 内存泄漏 - OracleCommand 对象

    我有内存泄漏 我很难找出问题出在哪里 ASP NET 进程时常会增加到 1GB 我已按照本页 http humblecoder co uk tag windbg 上的说明进行操作 并且 gcroot 命令返回以下内容 最后 x 行 我查看了
  • 将字符串格式化为标题大小写

    如何将字符串格式化为标题大小写 http www grammar monster com lessons capital letters title case htm 下面是一个在 C 中执行此操作的简单静态方法 public static
  • 如何在映射器(Hadoop)中使用MATLAB代码?

    我有一个处理图像的 matlab 代码 我想创建一个使用该代码的 Hadoop 映射器 我遇到了以下解决方案 但不确定哪一个最好 因为对我来说 在 hadoop 中的每个从属节点上安装 matlab 编译器运行时非常困难 手动将该 matl
  • SendKeys Ctrl + C 到外部应用程序(文本到剪贴板)

    我有一个应用程序作为托盘图标位于系统托盘中 我已经注册了一个热键 按下该热键将捕获任何应用程序中的当前文本选择 甚至在 Web 浏览器中也是如此 我的方法是发送组合键 Ctrl C 来复制文本 然后访问剪贴板并在我自己的应用程序中使用该文本
  • 如何使用 FlowLayout 确定 UICollectionView 的高度

    我有一个UICollectionView与UICollectionViewFlowLayout 我想计算它的内容大小 返回intrinsicContentSize通过自动布局调整其高度所需的 问题是 即使我对所有单元格都有固定且相等的高度
  • .Net Core - 复制到剪贴板?

    Is it possible to copy something to the clipboard using Net Core in a platform agnostic way 看来Clipboard https msdn micro
  • iOS 13 后,在 pdf 上导航文本框不再起作用 - 使用 PDFKIT 时似乎存在手势问题

    我实现了一个项目 我使用 PDFKIT 来执行一些如何在 pdf 上添加浮动文本框的操作 并且它可以通过用户触摸屏幕进行导航GestureRecognizer移动并放置在用户决定的地方 在iOS 13之前它可以完美运行 但是在iOS 13之
  • MVC4 StyleBundle 未按正确的顺序呈现包

    我正在尝试渲染一组 css 文件 但输出的顺序错误 我已经尝试过解决方案 MVC4 Beta 缩小和捆绑 在浏览器中排序文件和调试 https stackoverflow com questions 9657412 mvc4 beta mi