However when I uncomment BundleTable.EnableOptimizations = true; html output looks like this
And this is, of course is 404. I have no idea where I did something wrong, please help, first time working with MVC4.
回答1:
I imagine the problem is you putting the bundle at a virtual URL that actually exists, but is a directory.
MVC is making a virtual file from your bundle and serving it up from the path you specify as the bundle path.
The correct solution for that problem is to use a bundle path that does not directly map to an existing directory, and instead uses a virtual file name (that also does not map to a real file name) inside that directory.
Example:
If your site has a folder named /content/css, make your css bundle as follows:
In fact this is exactly what Microsoft does. The main reason they don't use ~/bundles for css is that relative paths get screwed up for images. Think about how your browser sees a bundle - exactly the same way as it sees any other URL, and all the normal path related rules still apply with respect to relative paths. Imagine your css had an image path to ../images/bullet.png. If you were using ~/bundles the browser would be looking in a directory above bundles which doesn't actually exist. It will probably end up looking in ~/images where you probably have it in ~/content/images.
I've found a couple things that can really break it and cause 404 errors:
FYI: My directory structure is Content/CSS which contains an images folder for CSS images.
I have EnableOptimizations=true to force use of bundles while testing
First thing you should do is 'View Source' and just click on the css links to see if they work
Let's say we're developing a site about cats. You may have this
@Styles.Render("~/Content/css/cats.css") // dont do this - see below why bundles.Add(new StyleBundle("~/content/css/cats.css").Include( "~/content/css/reset.css", "~/content/css/bla.css"));
This generates a CSS link to this path in your HTML:
Another problem already pointed out by others is you must not do
@Styles.Render("~/Content/css")
if you have a css directory or file (unlikely you'd have a file called css with no extension) in your Content directory.
An additional trick is that you need to make sure your generated HTML has a version number
If it doesn't and looks like this, then you probably don't have an exact match for the bundle name between your Bundle table and in your cshtml file.
回答3:
Don't forget to ensure the bundling HttpModule is there.
This stung me first time around. Not sure if the necessary config should be added by the NuGet package, but it wasn't in my case.
回答4:
That looks correct to me. When optimizations are enabled you'll only have a single ref and it'll be for the name you specified in your StyleBundle (/content/css). In debug mode (or more specifically with debug=false in your web config) you'll get the non-optimized files as normal. If you look, you'll see they're just plain text as you typed them. However, when optimzations are turned on (usually when you run in release mode) you'll get a wierd looking URL instead.
If you look at the output of that it'll be minified. The Query string ?v=5KLoJ.... is based on a hash taken of the files in the bundle. This is so that the reference can be safely HTTP cached for as long as you want. Forever if you fancy, but I think the default is a year. However, if you modify any of your stylesheets it will generate a new hash and that's "cache-busting" so you'll get a fresh copy on the browser.
Having said all that, I'm not sure why you're getting a 404. I suspect that has something to do with your routing configuration or your IIS setup. Are you running in Visual Studio with IISExpress?
回答5:
I just resolved a similar problem. The problem was as follow, i installed 'chosen' via NuGet. And in the BundleConfig class, the line that included the CSS file looked like this: