I am trying to minifying javascript files using mvc4 bundle feature

Question

I want to bundle all my JavaScript files so it should hit to server only once. But with this I am facing a problem.

bundles.Add(new ScriptBundle("~/LayoutJs").Include(
                "~/Scripts/Libraries/jquery-1.8.2.min.js",
                "~/Scripts/Libraries/kendo/2013.1.319/kendo.all.min.js",
                "~/Scripts/Libraries/jquery.blockUI.js",
                "~/Scripts/Libraries/knockout/knockout-2.1.0.js",
                "~/Scripts/Libraries/knockout/knockout.mapping-latest.js",
                "~/Scripts/Libraries/jquery.unobtrusive-ajax.min.js",
                "~/Scripts/Libraries/tabStrip.js",
                "~/Scripts/Libraries/underscore-min.js",
                "~/Scripts/Libraries/knockout/knockout-kendo.min.js",
                "~/Scripts/Common.js"
                ));

I am getting error that jquery is not defined but i included jquery at the top of the bundle.

How can I resolve this issue?

Add **all** jQuery JavaScript files **before** Kendo javascript files. — HemChe, May 09 '13 at 07:26

score 4 · Answer 1 · edited May 23 '17 at 12:29

4

I believe this is because you are trying to bundle min files. These files will get ignored by the MVC4 bundler.

The work around for this is to rename your files taking the .min out. Or create your own ignore patterns (see link).

https://stackoverflow.com/a/12005272/1593273

You could also upgrade to the 1.1-alpha1 release, where this has been fixed.

ASP.NET Web Optimization

edited May 23 '17 at 12:29

Community

1
1

answered May 09 '13 at 10:58

Colin Bacon

15,436
7
52
72

1

They are only ignored in debug mode. – MikeSmithDev May 09 '13 at 13:30

score 0 · Answer 2 · answered May 09 '13 at 07:24

Please first make sure that you have added scripts as like below

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
 "~/Scripts/jquery-1.7.1.min.js",
 "~/Scripts/jquery.validate.min.js",
 "~/Scripts/jquery.validate.unobtrusive.min.js"));

And make sure the above bundle is defined with in BundleConfig class as shown below:

public class BundleConfig
{
 public static void RegisterBundles(BundleCollection bundles)
 {


bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
 "~/Scripts/jquery-1.7.1.min.js",
 "~/Scripts/jquery.validate.min.js",
 "~/Scripts/jquery.validate.unobtrusive.min.js"));
 }
}

"*" wildcard character is used to combines the files that are in the same directory and have same prefix or suffix with its name. Suppose you want to add all the scripts files that exist with in "~/Script" directory and have "jquery" as prefix then you can create bundle like below:

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

All bundles are registered with in Application_Start event of Global.asax file of you web application.

protected void Application_Start()
{
 BundleConfig.RegisterBundles(BundleTable.Bundles);
 // code
}

When implemented with "BundleTable.EnableOptimizations = true;" then it works fine. but when i try same code with "BundleTable.EnableOptimizations = false; the it produces error that jquery is not defined — Prince Chopra, May 09 '13 at 07:40
if BundleTable.EnableOptimizations = false; then some of the files are are accessible and some are not. — Prince Chopra, May 09 '13 at 08:26
@PrinceChopra that's because any '.min' file is not included in debug mode. You either need to have the non minified version, or just rename the minified version to remove the '.min'. — MikeSmithDev, May 09 '13 at 13:30

I am trying to minifying javascript files using mvc4 bundle feature

2 Answers2