css.netc#-4.0bundling-and-minificationweb-optimization

Web Optimization conditional for browsers


I'm doing bundling and minification using Microsoft's Web Optimization infrastructure.

How can I set up to deliver different content depending on the browser? I want behaviour similar to conditional CSS files in the absence of bundling:

<!--[if lt IE 9]><link rel="stylesheet" href="~/Templates/Styles/ie.css"><![endif]-->

This is my bundling code at present.

public static void RegisterBundles(BundleCollection bundles)
{
     bundles.Add(new StyleBundle("~/Templates/Styles")
        .IncludeDirectory("~/Templates/Styles","*.css", true));

     // OR 
     bundles.Add(new StyleBundle("~/Templates/Styles")
            .Included("~/Templates/Styles/f5/normalize.css",
            "~/Templates/Styles/f5/foundation.css",
            "~/Templates/Styles/tipTip.css")
        );
}

Is conditional bundling possible? Or should I use traditional unbundled in-line references in my HTML, to files containing the conditional portions of my CSS?


Solution

  • If you have a look into the default format System.Web.Optimization.Scripts.DefaultTagFormat, you will find that you have something like:

    <script src='{0}'></script>
    

    So, the only thing you have to do is define a new format. You can do this using the "RenderFormat" method, like:

    <%: System.Web.Optimization.Scripts.RenderFormat("<!--[if lt IE 9]><script src='{0}'></script><![endif]-->", "~/bundles/IE9js") %>