使ASP.NET捆绑为CSS捆绑指定media = screen

GR7*_*GR7 42 asp.net-mvc asp.net-mvc-4 bundling-and-minification asp.net-optimization

我只是尝试ASP.NET 4.5捆绑和缩小,并遇到了一个问题.

我有大约10个css文件,其中2个最初在布局中使用属性media ="screen"引用.

由于将css添加到bundle的语法不允许你指定应该添加这样的属性(有意义,因为该属性将适用于整个bundle),我希望看到@ Styles.Render的重载,允许我指定html属性,就像在其他Html助手中一样,但没有.

有一个丑陋的解决方案,因为我知道创建的bundle的url,我可以自己制作标签,但是我会失去ASP.NET处理的缓存机制,允许它自己渲染标签.

有没有办法做到这一点,我错过了什么?或者这仅仅是对设计团队的监督?

Ada*_*Tal 75

我找到了一个更优雅的解决方案.

我正在使用Styles.RenderFormat(format, bundle).

我有一个BundlesFormats带有属性的类,PRINT我使用它如下:

public class BundlesFormats
{
    public const string PRINT = @"<link href=""{0}"" rel=""stylesheet"" type=""text/css"" media=""print"" />";
}
Run Code Online (Sandbox Code Playgroud)

在cshtml中:

@Styles.RenderFormat(BundlesFormats.PRINT, "~/bundles/Content/print")
Run Code Online (Sandbox Code Playgroud)

  • 请注意:此解决方案目前需要预发布版本的"Microsoft ASP.NET Web Optimization Framework".稳定版没有"RenderFormat"方法. (5认同)
  • 我花了一分钟才意识到它可以在一行上完成:@ Styles.RenderFormat("<link href =""{0}""rel =""stylesheet""type =""text/css""media =" "print""/>","〜/ bundles/Content/print") (4认同)
  • 这是1.1.0版本的一部分 (3认同)

GR7*_*GR7 14

嗯,这是一个丑陋的黑客,但希望团队将在下一个版本中添加一个内置方式来实现它.

这就是我解决它的方法,维护缓存字符串并仍然能够将media属性添加到标记中.

@{
    var cssMediaBundleUrl = BundleTable.Bundles.ResolveBundleUrl("~/stylesheets/mediacss", true);
}
<link href="@cssMediaBundleUrl" rel="stylesheet" type="text/css" media="screen" />
Run Code Online (Sandbox Code Playgroud)

猜猜我可以把它变成一个Html帮助器,稍后会这样做并编辑.

  • 你可以这样做:<link href ="@ Styles.Url("〜/ stylehseets/mediacss")"rel ="stylesheet"type ="text/css"media ="screen"/> (28认同)

Dan*_*eia 6

在不影响调试能力的情况下解决此问题的另一个选择可能是:

public static IHtmlString Render(string path, IDictionary<string, object> htmlAttributes)
{
    var attributes = BuildHtmlStringFrom(htmlAttributes);

#if DEBUG
    var originalHtml = Styles.Render(path).ToHtmlString();
    string tagsWithAttributes = originalHtml.Replace("/>", attributes + "/>");
    return MvcHtmlString.Create(tagsWithAttributes);
#endif

    string tagWithAttribute = string.Format(
        "<link rel=\"stylesheet\" href=\"{0}\" type=\"text/css\"{1} />", 
        Styles.Url(path), attributes);

    return MvcHtmlString.Create(tagWithAttribute);
}
Run Code Online (Sandbox Code Playgroud)

我正在做的只是将给定的html属性附加到标记的末尾(在调试模式下)或附加到唯一的链接标记的末尾(当启用缩小/捆绑时).

视图中的用法:

@Bundles.Render("~/css/print", new { media = "print" })
Run Code Online (Sandbox Code Playgroud)

其余代码:

public static IHtmlString Render(string path, object htmlAttributes)
{
    return Render(path, new RouteValueDictionary(htmlAttributes));
}

private static string BuildHtmlStringFrom(IEnumerable<KeyValuePair<string, object>> htmlAttributes)
{
    var builder = new StringBuilder();

    foreach (var attribute in htmlAttributes)
    {
        builder.AppendFormat(" {0}=\"{1}\"", attribute.Key, attribute.Value);
    }

    return builder.ToString();
}
Run Code Online (Sandbox Code Playgroud)

我写了一篇关于这个主题的博客文章:http://danielcorreia.net/blog/quick-start-to-mvc4-bundling/