ASP.Net MVC Style Bundle Not Including Most Files

Question

Recently, my local copy of a project completely lost most of its styling. Took me a while to figure it out, as most of the styling was done in one file and the rest were minor things like Kendo and jQuery UI.

The other, minor stuff wasn't being added to the page. I thought the styles had been modified by another developer (haven't touched this project in a while) who was only testing the Web API stuff and not the UI so he could have wrecked it and never known, but I tracked down the problem: only the site.css file was being included in the bundle and none of the other ones. I even tried rearranging the order of the CSS files included in the bundle and it would ONLY include site.css.

I rebuilt the project, cleared the cache, etc., so it was definitely seeing changes. I remember updating some NuGet packages or VS packages or something lately - possibly even the MVC package?

My question is: Did something change that made this happen? What's causing this?

EDIT: Code from BundleConfig.cs:

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new StyleBundle("~/Content/css").Include(
            "~/Content/site.css",
            "~/Content/themes/kendo/kendo.common.min.css",
            "~/Content/themes/kendo/kendo.default.min.css",
            "~/Content/themes/base/minified/jquery.ui.core.min.css",
            "~/Content/themes/base/minified/jquery.ui.resizable.min.css",
            "~/Content/themes/base/minified/jquery.ui.selectable.min.css",
            "~/Content/themes/base/minified/jquery.ui.accordion.min.css",
            "~/Content/themes/base/minified/jquery.ui.autocomplete.min.css",
            "~/Content/themes/base/minified/jquery.ui.button.min.css",
            "~/Content/themes/base/minified/jquery.ui.dialog.min.css",
            "~/Content/themes/base/minified/jquery.ui.slider.min.css",
            "~/Content/themes/base/minified/jquery.ui.tabs.min.css",
            "~/Content/themes/base/minified/jquery.ui.datepicker.min.css",
            "~/Content/themes/base/minified/jquery.ui.progressbar.min.css",
            "~/Content/themes/base/minified/jquery.ui.theme.min.css"));
}

Code from _Layout.cshtml:

@Styles.Render("~/Content/themes/base/css", "~/Content/css")

Answer 1

By default, files with names ending in ".min.css" will only be included in release builds.

The recommended bundle configuration is to only include non-minified .css and .js files, then the .min version will be automatically selected (if it exists) in release builds, i.e. <compilation debug="false">in your Web.config.

You can control this behavior by clearing and then adding ignore rules to the BundleCollection.IgnoreList. An example BundleConfig could look like this:

public static class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        ConfigureIgnoreList(bundles.IgnoreList);

        // Setup your bundles...
    }

    public static void ConfigureIgnoreList(IgnoreList ignoreList)
    {
        if (ignoreList == null) throw new ArgumentNullException("ignoreList");

        ignoreList.Clear(); // Clear the list, then add the new patterns.

        ignoreList.Ignore("*.intellisense.js");
        ignoreList.Ignore("*-vsdoc.js");
        ignoreList.Ignore("*.debug.js", OptimizationMode.WhenEnabled);
        // ignoreList.Ignore("*.min.js", OptimizationMode.WhenDisabled);
        ignoreList.Ignore("*.min.css", OptimizationMode.WhenDisabled);
    }
}

You can also explicitly enable/disable the optimization by setting BundleTable.EnableOptimizations.