public static void RegisterBundles(BundleCollection bundles) { bundles.IgnoreList.Clear(); // Some JavaScript bundles only // ... bundles.Add(new StyleBundle("~/bundles/maincss").Include( "~/Content/bootstrap.css","~/Content/bootstrap-responsive.css","~/Content/my.css")); } }
所有软件包都使用Nuget进行安装(正如我所说,它在调试模式下工作正常)。我的内容文件夹还包含引导程序… css文件的最小化版本,但不包含my.css的最小化版本。字形图标位于图像子文件夹中。
我的_Layout.cshtml看起来像这样:
<head> ... @Styles.Render("~/bundles/maincss") </head>
我应该通过“非调试”模式添加,我的意思是在Web.config文件中设置debug =“false”选项:
<compilation debug="false" targetFramework="4.5" />
有没有人有任何想法为什么twitter引导图标不显示在“非调试”模式?
谢谢
抢
解决方法
长篇小说与捆绑后相对路径被弄脏有关。但好消息是最新的捆绑库解决了它。
更新
为了填补空白,基本上发生了什么事情是CSS文件具有资源的相对路径(在这种情况下是一个图标精灵)。在调试模式下,文件分别输出到页面,以便保留引用(/Content/bootstrap.css引用images / glyphicons-halflings.png(使完整路径/ Content / images / glyphicons-halflings)。 png)但是,当调试被删除时,文件是捆绑的,并且路径现在相对于你给你的捆绑包的任何虚拟路径。在上面的情况下,你现在来自/ bundles / maincss,这使得错误/捆绑/ maincss / images / glyphicons-halflings.png路径。
好消息是,这是一个resolved bug和Microsoft.AspNet.Web.Optimization v1.1.0,现在有CssRewriteUrlTransform将替换所有的相对路径(在CSS文件内)与他们的绝对对照。这意味着无论您所谓的捆绑包,资源仍将被解决。
所以,要解决这个问题,你可以简单地做以下几件事:
IItemTransform cssFixer = new CssRewriteUrlTransform(); bundles.Add( new StyleBundle("~/bundles/maincss") .Include("~/Content/bootstrap.css",cssFixer) .Include("~/Content/bootstrap-responsive.css",cssFixer) .Include("~/Content/my.css",cssFixer) );
我唯一的质量是当你想要多个文件时看起来很丑,所以要解决这个问题,你可以用扩展方法来简化它:
/// <summary> /// Includes the specified <paramref name="virtualPaths"/> within the bundle and attached the /// <see cref="System.Web.Optimization.CssRewriteUrlTransform"/> item transformer to each item /// automatically. /// </summary> /// <param name="bundle">The bundle.</param> /// <param name="virtualPaths">The virtual paths.</param> /// <returns>Bundle.</returns> /// <exception cref="System.ArgumentException">Only available to StyleBundle;bundle</exception> /// <exception cref="System.ArgumentNullException">virtualPaths;Cannot be null or empty</exception> public static Bundle IncludeWithCssRewriteTransform(this Bundle bundle,params String[] virtualPaths) { if (!(bundle is StyleBundle)) { throw new ArgumentException("Only available to StyleBundle","bundle"); } if (virtualPaths == null || virtualPaths.Length == 0) { throw new ArgumentNullException("virtualPaths","Cannot be null or empty"); } IItemTransform itemTransform = new CssRewriteUrlTransform(); foreach (String virtualPath in virtualPaths) { if (!String.IsNullOrWhiteSpace(virtualPath)) { bundle.Include(virtualPath,itemTransform); } } return bundle; }
这使得上面的代码更清洁一些。 (可以说,我选择了一个很长的方法名称,但是我喜欢保持方法名称清楚的目的)
bundles.Add( new StyleBundle("~/bundles/maincss").IncludeWithCssRewriteTransform( "~/Content/bootstrap.css","~/Content/my.css" ) );