ASP.NET MVC 5 bundled scripts not being called in _Layout.cshtml

Question

Before I start let me say that I know there are other questions on SO about this issues that have great answers but please let me explain how mine is different.

I have an ASP.NET MVC 5 project where I have a collection of bundles:

public class BundleConfig
{
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery.js"));

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*"));

        // Use the development version of Modernizr to develop with and learn from. Then, when you're
        // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
        bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                    "~/Scripts/modernizr-*"));


        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
            "~/Scripts/bootstrap.js"));

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

        // Plugin JavaScript
        bundles.Add(new ScriptBundle("~/bundles/pluginjs").Include(
                "~/Scripts/cbpAnimatedHeader.js",
                "~/Scripts/classie.js"));

        //Custom Theme js
        bundles.Add(new ScriptBundle("~/bundles/customthemejs").Include(
                    "~/Scripts/freelancer.js"));

        // Contact Form JavaScript
        bundles.Add(new ScriptBundle("~/bundles/contactvalidation").Include(
                  "~/Content/jqBootstrapValidation.js",
                  "~/Content/contact_me.js"));
    }

These are called in _Layout.cshtml:

    @Scripts.Render("~/bundles/customthemejs")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/contactvalidation")
    @Scripts.Render("~/bundles/pluginjs")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)   
</body>
</html>

And in `global.asax:

protected void Application_Start()
    {
        AreaRegistration.RegisterAllAreas();
        FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
        RouteConfig.RegisterRoutes(RouteTable.Routes);
        BundleConfig.RegisterBundles(BundleTable.Bundles);
    }

Here is what I know so far:

1. All the StyleBundle's are called and invoked successfully so I can pin point the problem to something within the script referencing
2. The scripts referred too are in the correct folder i.e ~/Scripts/.... so I know that it isn't a referencing issue.
3. The scripts are working as I have tested them using a Web Forms project
4. I have tried referencing the bundles in the head section of _Layout.cshtml but no change
5. Dev tools in chrome and debugger in VS show the the script is not being run
6. My only suspicion is that there is a gap somewhere between the call from _Layout.cshtml and the bundles in BundleConfig class

I have tried other solutions that others have recommended around the web such as looking for syntax errors etc... but as far as I am aware there are none.

To make the structure of the scripts obvious I have included a screen shot:

Can anyone see this in a different perspective than myself and see where I have gone wrong?

Answer 1

Your code looks correct, though you're referencing the Microsoft.Web.Optimization the application config may not be working correctly. You can force the reference so that the application will utilize the Web.Optimization. Inside of your _Layout.cshtml above your bundled data, place the following:

@using System.Web.Optimization

That should correctly enforce the Web.Optimization.

The only other part that may be wrong, we can't see is your Global.asax. You need to ensure that you call the RegisterBundle.

BundleConfig.RegisterBundles(BundleTable.Bundles);