Azure release build not showing bundles

Question

When I publish my debug build onto Azure... all of my style files are reachable.

When I publish my release build onto Azure... none of my style fies are reachable.

You do not have permission to view this directory or page.

In my code I have bundles like this:

        bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/Packages/Bootstrap/src/bootstrap.css",
                  "~/Content/CSS/site.css",
                  "~/Content/CSS/bootstrap-theme-conflicts.css" ) );

In my razor view I have this:

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

My folder structure for Content is:

The end url in the published application is:

azurewebsites.net/Content/css/?v=i2nuaUMdmGVopZ-yRx75EKwl3vXByH5xgX4-uk0R9oE1

If I go directly to the files... ie:

azurewebsites.net/Content/CSS/Site.css

They are there fine.

Helpful resource:

Bootstrap icons are loaded locally but not when online

Answer 1

The bundle name must represent a real directory of files + 1 level down... so I added my directory in, and then added the word files at the end. the word files then becomes the file name!

So for my example, I had to split my bundles up:

        bundles.Add(new StyleBundle("~/bundle/Packages/Bootstrap/src/files").Include(
                  "~/Content/Packages/Bootstrap/src/bootstrap.css"));

        bundles.Add(new StyleBundle("~/bundle/CSS/files").Include(
                  "~/Content/CSS/site.css",
                  "~/Content/CSS/bootstrap-theme-conflicts.css"));

And then in my razor views, I changed mine to:

@Styles.Render("~/Content/Packages/Bootstrap/src/files")
@Styles.Render("~/Content/CSS/files")

Answer 2

I was facing this problem while deploying the code in Azure websites. it did worked when I deployed build from visualstudio.com and wasn't when I tried to publish the build from visual studio 2013. the main problem was CSS Minification. I totally agree with 1st response to this question. but thought of sharing solution that worked for me, may be it will help you in fixing it.

basically when we deploy through VSO it generates minification files for css, js by kicking in system.web.Optimization, but when we do publish build from VS 2013 we have to take care of the below. bundling-and-minification 1. make sure the folder structure and your bundler naming convention should be different. something like this.

bundles.Add(new StyleBundle("~/Content/materialize/mcss").Include(
                  "~/Content//materialize/css/materialize.css"));

2. add at the bottom of your bundleconfig definition

public static void RegisterBundles(BundleCollection bundles)
{
  bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
             "~/Scripts/jquery-{version}.js"));

   // Code removed for clarity.
   BundleTable.EnableOptimizations = true;
}

3. make sure to add debug false in web.config (when you start local debuging VS2013 will give you a popup saying that you need to make sure to putting it back before deploying into prod. that itself explains much.

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

For more information - why-is-my-css-bundling-not-working-with-a-bin-deployed-mvc4-app