Angular-Kendo Breaks when Bundled

330 views Asked by At

I have a angular project built in Visual Studio using the angular-kendo directive add-on and it works fine until I enable optimizations in the bundle.config file then it throws these errors: screenshot of console

I am just curious if anybody has had experience with this or what? I suspect that the angular-kendo.js file just isn't set up using an array so when it is bundled the parameter names get shortened which is what breaks everything but does anybody know how to fix it? Thanks in advance.

2

There are 2 answers

0
Chase Gibbons On BEST ANSWER

I would like to say thanks to null above, his answer was the best possible with what little information I provided. It turned out my main kendo bundle was the one that was breaking everything, for some reason when it tried to minify either the kendo.all.js or the kendo.all.min.js file, it broke it. I fixed the issue by using the already minified version of that file and only bundling and not minifying this particular bundle. This is done by simply creating a new "Bundle" instead of "ScriptBundle" as shown here:

  bundles.Add(new Bundle("~/bundles/kendo").Include("~/Scripts/kendo.all.min.js", "~/Scripts/kendo.aspnetmvc.min.js")); 

vs.

  bundles.Add(new ScriptBundle("~/bundles/kendo").Include("~/Scripts/kendo.all.js", "~/Scripts/kendo.aspnetmvc.js")); 

Thanks again to null!

0
null On

I'm not familiar with Kendo but I'm guessing this is a ASP.NET MVC website and Kendo is using the builtin bundle optimisation from that. A lot of problems that arise with this optimiser either has to do with incorrect file paths, the order of inclusion and/or excluded files based on their filename.

Check the network console if there are any 404 to detect incorrect path requests.

You can enforce the correct ordering like this.

If the (debug) Kendo javascript files are indeed not arrayified correctly, dependency injection will fail. I'm guessing Kendo already comes with a pre-minified version called something like kendo-blabla.min.js. The bundle optimiser should, by filename convention, include this file instead of minifying the debug version himself but I've some projects where this failed. The easiest way around this is including the pre-minified instead of the debug version in the bundle directly:

var kendoJs = BundleTable.EnableOptimizations ? "~/path-to/kendo.js" : "~/path-to/kendo.min.js";