title: Relative paths in CSS not valid when using MVC w/Bundles
body: <p>I've been developing a MVC5 web application for several months. I've published to each of 3 servers used for development, testing and the intended public server. Everything has been tested by a team of a dozen beta testers and a decision was made to go live with the web app this weekend.</p>
  
  <p>Prior to publishing the web app to the live (public) host I modified the web.config to disable debug mode for the public site. After publishing, all kinds of problems cropped up related to missing CSS and JS resources.</p>
  
  <p>After reading a lot of articles regarding Bundles and 404 errors, I found one that hinted to add the following to Web.config:</p>
  
  <pre><code>&lt;modules runAllManagedModulesForAllRequests="true"&gt;
    &lt;remove name="BundleModule" /&gt;
    &lt;add name="BundleModule" type="System.Web.Optimization.BundleModule" /&gt;
  &lt;/modules&gt;
  </code></pre>
  
  <p>This resolved the 404 issues for the StyleBundle and ScriptBundle configurations, but now I have 404 errors for images that previously worked fine. I'm not sure of the best way to resolve these. I don't want to relocate the images and I don't want to edit the CSS since these are distribution files (jQueryUI, ThemeRoller, DataTables, etc). I want to leave their distribution folder structure and original source files (CSS and JS) unmodified.</p>
  
  <p>An example of the problem.</p>
  
  <p>DataTables distribution is in my ~/Scripts folder:</p>
  
  <pre><code>/Scripts/DataTables-1.10.2/
  /Scripts/DataTables-1.10.2/media/css
  /Scripts/DataTables-1.10.2/media/images
  /Scripts/DataTables-1.10.2/media/js
  </code></pre>
  
  <p>Bundles configuration:</p>
  
  <pre><code>bundles.Add(new ScriptBundle("~/bundles/DataTables").Include(
       "~/Scripts/DataTables-1.10.2/media/js/jquery.dataTables.js"));
  
  bundles.Add(new StyleBundle("~/bundles/DataTables.css").Include(
       "~/Scripts/DataTables-1.10.2/media/css/jquery.dataTables.css"));
  </code></pre>
  
  <p>jquery.dataTables.css contains references to ../images/someimage.png and with Web.config debug mode enabled this works flawlessly. Now that debug mode has been disabled and Bundles are minifying/combining, I am getting 404 errors:</p>
  
  <pre><code>http://example.com/GenericError.htm?aspxerrorpath=/images/someimage.png"
  </code></pre>
  
  <p>It seems as though the image URL is now assumed to be relative to /Bundles/ - though I'm not positive.</p>
  
  <p>There must be an additional configuration I'm missing. Can someone point me in the right direction?</p>
  
  <p><strong>EDIT</strong> </p>
  
  <p>Raphael's comments on this question and his URL to another similar SO question did not help to resolve this problem. Sean's recommendation of BundleTransformer seems like it might work but I don't find any documentation on how to install this package.</p>