Wrong order of MVC Script Bundles after debug set to false

Question

UPDATE: After some time the bundling works fine, dont know what it was )

In my BundleConfig.cs I have these bundles defined

public static void RegisterBundles(BundleCollection bundles) 
{
    bundles.Add(new ScriptBundle("~/bundles/vendor").Include(
        "~/Scripts/jquery-{version}.js",
        "~/Scripts/bootstrap.js",
        "~/Scripts/bootstrap-datetimepicker.js",
        "~/Scripts/es6-shim.js",
        "~/Scripts/toastr.js",
        "~/Scripts/angular.js",
        "~/Scripts/angular-route.js",
        "~/Scripts/highcharts.src.js",
        "~/Scripts/highcharts-ng.js",
        "~/Scripts/angular-block-ui.js",
        "~/Scripts/angular-translate.js"));

    bundles.Add(new ScriptBundle("~/bundles/app").Include(
        "~/Scripts/app/app.js",
        "~/Scripts/app/directives.js",
        "~/Scripts/app/translation.js",
        "~/Scripts/app/data.service.js",
        "~/Scripts/app/main.controller.js",
        "~/Scripts/app/parameters.controller.js",
        "~/Scripts/app/schedules.controller.js",
        "~/Scripts/app/settings.controller.js",
        "~/Scripts/app/subscriptions.controller.js"));
}

In my Index.cshtml file I have this sequence of adding these bundles

@Scripts.Render("~/bundles/vendor")
@Scripts.Render("~/bundles/app")

If in web.config

<compilation debug="true" targetFramework="4.5">

I have correct bundle sequence

If I change debug to false

<compilation debug="false" targetFramework="4.5">

the sequence is broken, and the app doesnt work!

Why is this happening? How to fix?

Ignore the order of the requests made by the browser, the important thing is the order of the rendered <script> elements. Please post your rendered HTML. — Dai
– Dai, Commented Mar 31, 2017 at 19:56
Are the bundles rendered out of order, or the scripts inside each bundle that are out of order? You have a screenshot, but I cannot see it due to firewall restrictions. — user47589
– user47589, Commented Mar 31, 2017 at 20:56
the bundels, the scripts too, but bundles order is what breaks — Slava
– Slava, Commented Apr 1, 2017 at 3:48
Dai, the last screenshot is how the scripts are added in HTML — Slava
– Slava, Commented Apr 6, 2017 at 23:11
The section @Scripts.Render("~/bundles/app") can be messed up due to having same name (app) as script placeholder directory name ~/Scripts/app. Try renaming bundle name after bundles part. — Tetsuya Yamamoto
– Tetsuya Yamamoto, Commented Apr 17, 2017 at 5:13

Amirhossein Mehrvarzi · Accepted Answer · 2017-04-18 20:53:11Z

1

It's not typical to use more than one Scripts.Render stuck together in a page where you can merge the scripts into one bundle. Such this may be required when you work with partial/conditional scripts in specific views where we use RenderSection to meet our purpose.

Your problem comes from the reality which is bundling order is alphabetical for names with wildcards. In your case, app called before vendor.

My first solution is using one Scripts.Render if it's possible.

Second solution would be to change the place of calling second Scripts.Render, say, app scripts like using them in the bottom of page or using meta tags between them (not after the vendor to avoid ordering).

If you want to ensure that scripts are in correct order, please don't use multiple Scripts.Render. Instead, Configure the ordering for single bundle.

edited Apr 18, 2017 at 20:53

answered Apr 18, 2017 at 20:17

Amirhossein Mehrvarzi

19.1k7 gold badges52 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Slava Over a year ago

Amirhossein Mehrvarzi, the problem is that I have tried everything you said ) Alphabetical order is not the reason, I tried to rename bundles, but it didnt change the order. Also the Render commands are in correct order, first I render vendor bundle, then, my scripts bundle. Having two separate bundles is essential, since I need to include vendor libs first. Next I have embedded object JS generation based on server-side cide, and only then, I include my apps bundle.

Slava Over a year ago

I understand what you are saying about preferably using one bundle, that was my target initially, but in our scenario (specifics of the project), vendor and custom scripts must be in two bundles. It is absolutely normal thing to have more than 1 bundle, I just don't get why MVC changes the order. But thanks a lot for the reference about ordering scripts inside the bundle, I will see if I can change something to make this happen, that would be ideal. Will give it a try and will let you know if it worked ))

Collectives™ on Stack Overflow

Wrong order of MVC Script Bundles after debug set to false

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related