C# ASP.NET MVC scripts being loaded in twice

Question

I have a C# ASP.NET MVC application that is loading scripts twice and giving me errors in the console. The first time the scripts are loaded, they are loaded correctly, but the second time, they are causing errors.

Here is a screenshot of the browser console:

Here is my layout, this is the only place where scripts are being called:

<head>
    <meta http-equiv="x-ua-compatible" content="ie=edge" charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="png/favicon.png" id="favicon-i">

    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/other")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @Scripts.Render("~/bundles/picker")
</head>

Here are my bundles, not all of them are being used:

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                "~/Scripts/jquery-{version}.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 
// https://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",
                "~/Scripts/bootstrap.min.js"));

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                "~/Scripts/jquery-3.3.1.min.js",
                "~/Scripts/jquery-3.3.1.js"));

bundles.Add(new ScriptBundle("~/bundles/picker").Include(
                "~/Scripts/bootstrap-datepicker.js",
                "~/Scripts/bootstrap-datetimepicker.js",
                "~/Scripts/bootstrap-datetimepicker.min.js",
                "~/Scripts/bootstrap-multiselect.js"));

bundles.Add(new ScriptBundle("~/Scripts").Include(
                "~/Scripts/tether.min.js",
                "~/Scripts/tether.js",                 
                "~/Scripts/apexcharts.min.js",
                "~/Scripts/layout.js",
                "~/Scripts/moment.js",
                "~/Scripts/Chart.js"));

bundles.Add(new ScriptBundle("~/bundles/other").Include(
                "~/Scripts/tether.min.js",
                "~/Scripts/tether.js",
                "~/Scripts/apexcharts.min.js",
                "~/Scripts/layout.js",
                "~/Scripts/moment.js",
                "~/Scripts/Chart.js"));

bundles.Add(new StyleBundle("~/Content/css").Include( "~/Content/bootstrap.css", "~/Content/layout.css", "~/Content/Style.css", "~/Content/tether.min.css", "~/Content/bootstrap-datepicker.css", "~/Content/bootstrap-datetimepicker.css", "~/Content/bootstrap-multiselect.css"));

Any ideas why this is happening?

EDIT: This is what the initiator looks like:

What is the difference between the files in "~/Scripts" and "~/bundles/other" — I_Al-thamary
There is no difference, I was trying to see if "~/Scripts" was rendering everying — GreenSaber
See this blog.michaelckennedy.net/2012/10/11/… it may help if you use the script — I_Al-thamary
Also, try to change EnableEmbeddedjQuery to be false docs.telerik.com/devtools/aspnet-ajax/controls/scriptmanager/… — I_Al-thamary
I think that the directory change, So it gives an error 404. — I_Al-thamary

combatc2 combatc2 · Accepted Answer · 2019-11-01T20:38:17

Looking at the initiator column on the network tab in Chrome dev tools can help track down where the files are being loaded from

C# ASP.NET MVC scripts being loaded in twice

1 Answers