Script bundles not rendering individual files in debug

Question

I have two script bundles defined:

bundles.Add(new ScriptBundle("~/scripts/common").Include(
                        "~/Scripts/jquery-1.11.1.js",
                        "~/Scripts/jquery-ui-1.10.4.custom.min.js",
                        "~/Scripts/jquery.validate.js"));

bundles.Add(new ScriptBundle("~/scripts/sectionCommon").Include(
                        "~/Scripts/A.js",
                        "~/Scripts/B.js",
                        "~/Scripts/C.js"));

I have one set on my master layout page:

@Scripts.Render("~/scripts/common")

And one set on a subset of my pages where it is used:

@Scripts.Render("Scripts/sectionCommon")

So far so good and this works.

When I run my site using debug compilation, the JS files from the first bundle are rendered to the markup as individual script links per file, whereas the second bundle remains as a single minified bundle:

<script src="/siteRoot/Scripts/jquery-1.11.1.js"></script>
<script src="/siteRoot/Scripts/jquery-ui-1.10.4.custom.min.js"></script>
<script src="/siteRoot/Scripts/jquery.validate.js"></script>

<script src="/siteRoot/Scripts/sectionCommon"></script>

Does anybody have any idea why this might be happening? Bit of a pain while debugging.

Answer 1

Figured this out while I was writing the question. Thought I would answer it in case this bites anybody else. The difference between the two was using the tilda to get a site relative url:

@Scripts.Render("~/scripts/common")

@Scripts.Render("Scripts/sectionCommon")

Both of these render out the script as intended, but only the top one (using the site relative URL) was rendering out the individual script references in debug.