Monthly Archives: August 2013

ASP.NET 4.5 MVC Bundling and Minification troubleshooting

ASP.NET 4.5 includes the System.Web.Optimization namespace (it can also be added via NuGet).  This library provides functionality to bundle and minify (B/M) your scripts and stylesheets.

Running some tests today, I noticed that my css image links were breaking whenever I enabled the B/M optimizations. Researching this, I realized I was using relative paths for the images in my CSS files. When B/M occurs, the pseudo path is used to resolve to the B/M’d files, which is usually different from the physical path of the files. In my case, the physical path was at ~/public/css and the B/M pseudo path was ~/bundle/css. Since my images are located in ~/public/images, the relative paths were no longer resolving.

Thinking this would be an easy fix, I changed the B/M pseudo path to mirror the physical path ~/public/css. Unfortunately, this broke my css entirely. Checking the server response, I saw that I was getting a 403.14 error.

Turns out the MVC router blocks calls for B/M files that resolve to actual paths in the project. This is expected behavior, since the router is always called first and is simply doing it’s job (duh)!

The easiest fix for this is to simply change the pseudo path to one level lower than the actual path (in my case, changing it to ~/public/css/bundle). The CSS file will then properly resolve all the relative image paths, regardless of whether or not B/M is on.

Advertisements