0

Whilst developing my website I have been adding styles directly to the cshtml files but I've now got to a stage where I'd like to include them in bundles instead. I have been going through my _Layout.cshtml and swapping out groups of styles with bundles and it's been going fine. However, I've come to a particularly stubborn style that isn't included when put in a bundle.

In my _Layout.cshtml I have the following style link:

 <link href="@Url.Content("~/Scripts/plugins/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css")" rel="stylesheet" type="text/css" />

This works fine, I can see a visible difference in my datatables. However, if I now add it to a style bundle in my BundleConfig.cs like so:

bundles.Add(new StyleBundle("~/Styles/datatables").Include(
                  "~/Scripts/plugins/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css"));

And then add the bundle to my _Layout.cshtml like so:

@Styles.Render("~/Styles/datatables")

It just isn't included! I can see a visible difference in my datatable so I definitely know it's not working!

I have many other bundles working for both styles and scripts, it just appears to be this one..

Any ideas?

Thanks

UPDATE:

When I set EnableOptimizations to false, it all works fine. When I set EnableOptimizations to true, a lot of my styles stop rendering..

UPDATE 2

The only other time this happens is with the font-awesome.css stylesheet.

Murphybro2
  • 2,207
  • 1
  • 22
  • 36
  • Do you have this line in `Application_Start` inside Global.asax: `BundleConfig.RegisterBundles(BundleTable.Bundles);`? If it's true, change the style rendering order in layout page, include all related JS files too. – Tetsuya Yamamoto Oct 02 '17 at 08:38
  • I do have that in my Global.asax.cs file yes. If I'm replacing the html link element with the razor style render in the same line, shouldn't it render in the exact same order? – Murphybro2 Oct 02 '17 at 08:42
  • Two questions: 1. When you have optimizations enabled, can you navigate to /Styles/datatanles in your browser and see .css content? 2. Does your solution already contain a Styles directory? – lowds Oct 02 '17 at 09:31
  • Yes I can, there's a file at http://localhost:32502/Styles/datatables?v=g8IRw9DiIDhN6fWwNwy3W4V42mDD5FGMw4KgY1Jv9xE1 that contains .css content. Are you asking whether I've already created a virtual Styles directory in the bundling? Or if my actual solution has a Styles folder? Either way, the answer is no to both! – Murphybro2 Oct 02 '17 at 09:55
  • I have another style for datatables that works, if I put the problem css file in the same directory as that and reference the new path it still won't work. Heck if I copy the content from the problem css to the css that is being picked up.. still no change!! The only way I can get it to show is if I put the link element in the html! – Murphybro2 Oct 02 '17 at 09:58
  • Do the CSS files have references to images / fonts in them? It's likely that the relative paths contained in the CSS files are no longer valid when combined into a bundle (font awesome is the classic tell tale sign for this). See this answer for a fix https://stackoverflow.com/questions/22700385/font-awesome-not-working-bundleconfig-in-mvc5 – SlightlyMoist Oct 02 '17 at 10:31
  • I actually read that page earlier and tried the suggested answer.. but it didn't work so I dismissed the idea of CssRewriteUrlTransform fixing my problem. However, now coming back to it and deleting my min.css files it has proven to be the fix! Well don't I feel stupid.. Thanks by the way, it was your mention of image urls being invalided that made me see the light! – Murphybro2 Oct 02 '17 at 10:57

0 Answers0