Publishing a Website Is Not Updating My CSS Bundles

Publishing a website is not updating my CSS bundles

This can happen if you have a minified version of a css file in the same directory as your unminified file.

For example, if you have the following files:

    ~/Content/bootstrap.css
    ~/Content/bootstrap.min.css

in your directory, and you register the "bootstrap.css" file in your bundle, the optimizer will first attempt to use the "bootstrap.min.css" file during publish. If you only updated the "bootstrap.css" file and did not update the "bootstrap.min.css" file, you will get the old styles from "bootstrap.min.css". You can fix this problem by deleting the "bootstrap.min.css" file or by updating it.

This does not happen in a debug build because it does not pull the minified files if your compilation is set for debug using the following:

<system.web>
    <compilation debug="true" />
    <!-- Lines removed for clarity. -->
</system.web>

You can also overwrite the web.config setting by disabling the optimizations via:

    BundleTable.EnableOptimizations = false;

This would go inside your BundleConfig.cs file.

Bundles not appearing after website publish

Try to add the following line to your BundleConfig.cs file

BundleTable.EnableOptimizations = true;

Please note : If you are using bootstrap for MVC you might also have to add this line of code to BootstrapBundleConfig.cs

CSS Not Working After Published

Solved , just add

BundleTable.EnableOptimizations = false;

in BoundalConfig

Publishing Umbraco site, bundles doesn't work

Assuming you're using Umbraco 6 or 7, you could follow the gist here: How to use ASP.NET Bundling and Minifications in Umbraco

However, you should use an ApplicationEventHandler derived class so that you can register them on startup instead of trying to create your own Global.asax.cs class (this is now the recommended way of doing this sort of thing with Umbraco):

public class ArticleEventHandler : Umbraco.Core.ApplicationEventHandler
{
    protected override void ApplicationStarted(UmbracoApplicationBase umbracoApplication, ApplicationContext applicationContext)
    {
        BundleConfig.RegisterBundles(BundleTable.Bundles);
    }
}

An alternative to Bundling is to use the ClientDependency package that comes bundled with Umbraco. I can elaborate on that if you need me to, however there are plenty of examples and documentation on that out there.

Why is my CSS bundling not working with a bin deployed MVC4 app?

The CSS and Script bundling should work regardless if .NET is running 4.0 or 4.5. I am running .NET 4.0 and it works fine for me. However in order to get the minification and bundling behavior to work your web.config must be set to not be running in debug mode.

<compilation debug="false" targetFramework="4.0">

Take this bundle for jQuery UI example in the _Layout.cshtml file.

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

If I run with debug="true" I get the following HTML.

<link href="/Content/themes/base/jquery.ui.core.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.resizable.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.selectable.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.accordion.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.autocomplete.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.button.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.dialog.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.slider.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.tabs.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.datepicker.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.progressbar.css" rel="stylesheet"/>
<link href="/Content/themes/base/jquery.ui.theme.css" rel="stylesheet"/>

But if I run with debug="false". I'll get this instead.

<link href="/Content/themes/base/css?v=myqT7npwmF2ABsuSaHqt8SCvK8UFWpRv7T4M8r3kiK01" rel="stylesheet"/>

This is a feature so you can easily debug problems with your Script and CSS files. I'm using the MVC4 RTM.

If you think it might be an MVC dependency problem, I'd recommend going into Nuget and removing all of your MVC related packages, and then search for the Microsoft.AspNet.Mvc package and install it. I'm using the most recent version and it's coming up as v.4.0.20710.0. That should grab all the dependencies you need.

Also if you used to be using MVC3 and are now trying to use MVC4 you'll want to go into your web.config(s) and update their references to point to the 4.0 version of MVC. If you're not sure, you can always create a fresh MVC4 app and copy the web.config from there. Don't forget the web.config in your Views/Areas folders if you do.

UPDATE: I've found that what you need to have is the Nuget package Microsoft.AspNet.Web.Optimization installed in your project. It's included by default in an MVC4 RTM app regardless if you specify the target framework as 4.5 or 4.0. This is the namespace that the bundling classes are included in, and doesn't appear to be dependent on the framework. I've deployed to a server that does not have 4.5 installed and it still works as expected for me. Just make sure the DLL gets deployed with the rest of your app.

Why do changes applied to bootstrap.css not work when published but do work on localhost?

The easy solution for me was to remove the css bundling.

I removed this line of code:
<webopt:bundlereference runat="server" path="~/Content/css" />
and also removed the Bundle.config file.

In my <head> tag I now have the below:

<link rel="stylesheet" runat="server" href="/Content/Site.css" type="text/css" />
<link rel="stylesheet" runat="server" href="/Content/bootstrap.css" type="text/css" />

CSS not updated during debugging ASP.NET MVC application

Your browser is caching the css. If you force a refresh with F5 that should display any changes.

---

Related Topics