Search code examples
jquery-mobileasp.net-mvc-4asp.net-optimization

Unable to Bundle JQuery Mobile 1.2 in ASP.NET MVC 4 app


I'm working on an ASP.NET MVC 4 app. This app leverages bundling to improve performance. Previously, the app was using jquery.mobile-1.1.0.js. Everything worked fine. However, I've upgraded to JQuery Mobile 1.2 and when I load my screen, I always see a wait spinner. I've pinpointed it to the fact that both the standard and the minified versions are being referenced. When I look in my view-source after the page is loaded, I see the following at the top:

<script src="/Scripts/jquery.mobile-1.2.0.js"></script>
<script src="/Scripts/jquery.mobile-1.2.0.min.js"></script>

From what I can tell, this was generated from the following in my ASP.NET MVC .cshtml file

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

In my BundleConfig.cs file, I have the following definition:

bundles.Add(new ScriptBundle("~/bundles/jquerymobile").Include("~/Scripts/jquery.mobile*"));

Essentially, I want to use the normal version when the debug="true" flag is set in my web.config compilation setting. However, when debug="false", I want to use the minified version. What am I doing wrong?

Thank you


Solution

  • This should happen automatically for you already (assuing the fileextensionreplacement lists still have the default "min" entry for when optimizations are enabled).

    As a workaround, you could try this instead which should also work:

    .Include("~/Scripts/jquery.mobile-{version}.js"));
    

    This basically is similar to your * except it will regex match for version strings. Note, both this and what you have require that you only have the latest jquery in your Scripts folder, if you still have the 1.1 version there, you will end up with both versions in your page.