Bundling with MVC4 not working after I publish to azure

Question

Hi I am trying to bundle my scripts for my application. My debug is working and if I publish with the Web.debug every thing works fine. But when I publish with the Web.releas my scripts don't load. Everything works locally it only stops when I publish to Azure from VS2012. Here is how I create my bundles.

namespace BAT.App_Start
{
  public class BundleConfig
  {
    public static void RegisterBundles(BundleCollection bundles)
    {
        //BundleTable.EnableOptimizations = true;

        bundles.Add(new ScriptBundle("~/Content/MasterCss")
                .Include("~/Content/bootstrap.css")
                .Include("~/Content/bootstrap-responsive.css")
                .Include("~/Content/CSS/site.css"));

        bundles.Add(new ScriptBundle("~/Scripts/MasterScripts")
                .Include("~/Scripts/jquery-{version}.js")
                .Include("~/Scripts/bootstrap.js"));

        bundles.Add(new ScriptBundle("~/Scripts/Validation")
                .Include("~/Scripts/jquery.validate.js")
                .Include("~/Scripts/jquery.validate.unobtrusive.js"));
        }
    }
}

The un-commented line breaks the debug build

This is my layout where I call the bundles

@using System.Web.Optimization
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title Business Analysis Tool </title>

    @Styles.Render("~/Content/MasterCss")
</head>

<body>
    <div class="container-fluid">
        <div class="row-fluid"> @RenderPage("~/Views/Shared/_Header.cshtml") </div>
        <div class="row-fluid"> @RenderBody() </div>
        <div class="row-fluid"> @RenderPage("~/Views/Shared/_Footer.cshtml") </div>
    </div>
    @Scripts.Render("~/Scripts/MasterScripts")    
    @RenderSection("scriptholder", false)
</body>
</html>

This is my Release.Config

<?xml version="1.0"?>
    <configuration xmlns:xdt="http://schemas.microsoft.com/XML-Document-Transform"> 
    <system.web>
        <compilation xdt:Transform="RemoveAttributes(debug)" />
    </system.web>
    </configuration>

Here is a link to the error when I check the bundled script with CTRL+U on the page http://bat.azurewebsites.net/Content/MasterCss?v=htASNz4hgFFA40tt0CVZdpwQudN8ZW4429UjRQZQJms1

It seems to be something to do with minification. I've followed some tutorials and have read other posts here but their solutions arn't working for me

Hi Jeff. I seem to be in the same situation. You got any feedback on this? — Ronald, Jun 20 '13 at 20:25
Hi no I havn't had any luck yet with it. To just get something working I used the debug build to publish to Azure. That is working for me because I don't have a lot of scripts but I would really like to get the bundling working — Jeff Finn, Jun 21 '13 at 08:31
I'm seeing the same problem also. If I publish the Debug profile, it doesn't bundle and works. If I publish the Release profile, it seems like the jquery scripts I have on my page are not longer working. — Tim Cochran, Jun 21 '13 at 11:25

score 5 · Answer 1 · answered Oct 20 '14 at 19:20

really simple fix for this one:

I had the following:

bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/site.css"));

i also had a folder in my solution at:

/Content/Css

That was the problem, the stylebundle had the same name as a folder in my solution.

Renamed the stylebundle to:

 bundles.Add(new StyleBundle("~/scripts/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/site.css"));

and (remember) to change where you referrence it, _Layout.cshmtl

So to make this clear, if your stylebundle name is the same as an actual folder in your solution then you're gonna get this issue. Simply name it something different.

Similar problem. There is a folder Scirpts/app and there is a bundle defined in BundleConfig: ~/bundles/app. My script was located in the app folder. After renaming ~/bundles/app in BundleConfig.cs, to ~/bundles/theapp it worked. — yonexbat, Oct 17 '15 at 10:51

score 4 · Accepted Answer · answered Jul 07 '13 at 09:50

4

Small mistakes kill me, I was bundling my css as a script bundle not a style bundle.

I have done a lot to try fix this including setting up source control and build configurations. My project went from being set up to use git to tfs and everything.

answered Jul 07 '13 at 09:50

Jeff Finn

1,975
6
23
52

score 4 · Answer 3 · answered Jan 12 '14 at 02:12

In BundleConfig.cs I had the following:

        bundles.Add(new StyleBundle("~/Content/css").Include(
            "~/Content/css/bootstrap.css",
            "~/Content/css/bootstrap-responsive.css",
            "~/Content/css/site.css"));

I really actually had to use:

bundles.Add(new StyleBundle("~/Styles/css").Include(
            "~/Content/css/bootstrap.css",
            "~/Content/css/bootstrap-responsive.css",
            "~/Content/css/site.css"));

I also had to update the reference to my CSS Style bundle in _Layout.cshtml

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

I found this answer here: http://thebeardeveloper.blogspot.com.au/2013/02/403-forbidden-for-css-bundles-in-asp.html

This was the answer that helped me in my case. – Rolando Retana May 19 '16 at 05:33 — Rolando Retana, May 19 '16 at 05:33

score 2 · Answer 4 · answered May 12 '14 at 11:06

I had the same problem, but none of the above solutions worked for me.

The problem is, I had bundling like this:

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

bundles.Add(new StyleBundle("~/Content/css").Include(
    "~/Content/bootstrap.css",
    "~/Content/justified-nav.css",
    "~/Content/site.css"));

But, ~/Content/css is also a directory - which broke when deploying to Azure. I fixed this by changing ~/Content/css to ~/Content/mastercss in both locations

score 1 · Answer 5 · answered Jun 21 '13 at 12:02

1

I had a similar problem when publishing to Azure. The error was actually telling me that the jQuery file was bad formatted. ==> minified file that is.

The other scripts failed because jQuery was not identified.

I was using jQuery 2.0.0 (from NuGet). After upgrading today to 2.0.2 (from NuGet) I was able to publish successful to Azure under Release configuration.

Not sure if this is linked to your specific problem, but it solved mine.

answered Jun 21 '13 at 12:02

Ronald

1,990
6
24
39

Sorry for the delay in trying this but that didn't work for me. But thanks for the reply – Jeff Finn Jun 30 '13 at 10:53

score 1 · Answer 6 · answered Aug 17 '14 at 12:11

In my case of missing stylesheets, the problem was not due to the vagaries of publication to Azure, failures during minification or conflicting virtual and real paths.

It was due to the different behaviours of BundleCollection.Add(Bundle) between Debug and Release.

If you manage to do the following (for example, because you're using Durandal from NuGet and have multiple BundleConfig's initialized by WebActivator, and you didn't really write any of them yourself)

bundles.Add(new StyleBundle("/foo").Include("/a.css")); 
bundles.Add(new StyleBundle("/foo").Include("/b.css"));

Basically, if the bundles don't minify, this works: you get elements in your Razor page for both /foo/a.css and /foo/b.css.

But if minification is engaged, then b.css doesn't make it into the resulting minified resource. (or is a.css replaced ... I wasn't paying attention ... just trying to get it to work).

You can work around this by understanding the order of loading and using:

bundles.Add(new StyleBundle("/foo").Include("/a.css")); 
bundles.Add(bundles.GetBundleFor("/foo").Include("/b.css"));

... or by using a different named path (if that's really your intention), or refining your strategy to bundling initialization (which may potentially break NuGet updates).

If only the stupid 'documentation' for System.Web.Optimization classes actually bothered to specify the behaviour of adding multiple bundles with the same virtual path, we need not be having this discussion.

score 1 · Answer 7 · answered Jun 04 '15 at 13:18

Let's do some grave digging. Today I started fiddeling around with Azure and promptly ran into a similar problem.

the style bundle was defined like this:

bundles.Add(new StyleBundle("~/Styles/css").Include(
                  "~/Content/bootstrap.superhero.css",
                  "~/Content/site.css"));

But no css was being rendered. After almost opening up a second question I realized, that the file bootstrap.superhero.css was greyed out in the solution explorer. What was working locally in Visual Studio, was failing in Azure, because the file was not yet implemented in the project.

Tl;dr: Right-click the Css file and then "Include in project"

score 0 · Answer 8 · answered Apr 07 '17 at 01:58

As one of the answers mentioned, I have fought this a few hours, my problem was also that I had a folder called scripts, so I changed the name of the script from (this is from my index view)

@Scripts.Render("~/Scripts/CircleStats") //this is also a folder in my project, which I think is the problem for azure

to

@Scripts.Render("~/bundles/CircleStats")

And it's working, hopefully this will help someone

https://forums.asp.net/t/1810635.aspx?403+Access+denied+when+using+Bundling

score 0 · Answer 9 · answered Jul 03 '18 at 16:56

In my case, the virtual path of my bundle contains the . character. Something like :

bundles.Add(new ScriptBundle("~/bundles/jquery.loadTemplate").Include(
            "~/Scripts/jquery.loadTemplate/*.js");

I changed the dots by hyphens :

bundles.Add(new ScriptBundle("~/bundles/jquery-loadTemplate").Include(
            "~/Scripts/jquery-loadTemplate/*.js");

And everything works like a charm.

I'm still not sure why it worked on my local machine but not on Azure...

Bundling with MVC4 not working after I publish to azure

9 Answers9

Linked