Uncaught SyntaxError: Unexpected token < ERROR during bundle creation in IIS

Question

It was running smoothly in my local machine, when i host it to IIS server now the design is completely broken. After search i came into a change in my bundle config like as follows

bundles.Add(new  ScriptBundle("~/bundles/modernizr").Include("~/Scripts/modernizr-*"));

        bundles.Add(new ScriptBundle("~/Scripts/ui-js/uiPPScript").Include(
                                     "~/Scripts/ui-js/jquery.min.1.11.1.js"
                                     , "~/Scripts/ui-js/bootstrap.min.js"
                                     , "~/Scripts/ui-js/bootstrap-slider.js"
                                     , "~/Scripts/ui-js/bootstrap-lightbox.js"
                                     , "~/Scripts/ui-js/common-script.js"
                                     , "~/Scripts/ui-js/html5.js"
                                     , "~/Scripts/ui-js/jquery.colorbox.js"
                                     , "~/Scripts/ui-js/respond.src.js"
                                     , "~/Scripts/ui-js/angular.min.js"
                                     , "~/Scripts/ui-js/bootstrap.js"
                                     ,"~/Scripts/ui-js/jRate.min.js"
                                     , "~/Scripts/ui-js/jcrop.min.js"
                                     ));

        bundles.Add(new StyleBundle("~/Content/ui-css/uiPPStyle").Include(
                                    "~/Content/ui-css/bootstrap-slider.css"
                                    , "~/Content/ui-css/bootstrap-theme.min.css"
                                    , "~/Content/ui-css/colorbox.css"
                                    , "~/Content/ui-css/icomoon.css"
                                    , "~/Content/ui-css/pp-ie7.css"
                                    , "~/Content/ui-css/bootstrap.min.css"
                                    , "~/Content/ui-css/bootstrap-lightbox.css"
                                    , "~/Content/ui-css/pp-v8.css"
                                    , "~//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"
                                    ));

        bundles.Add(new ScriptBundle("~/Scripts/ppscripts").Include(
                         "~/Scripts/ppscripts/LocateSupplierMap.js",
                         "~/Scripts/ppscripts/PPCommon.js"
                         ));

and in my layout page i used

@Styles.Render("~/Content/ui-css/uiPPStyle/")
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/Scripts/ui-js/uiPPScript/")
@Scripts.Render("~/Scripts/ppscripts")

But this one still not rendering with correct design. When i checked my browser console i can see that

How do i solve this? is it the right way to use it?

score 2 · Accepted Answer · answered Aug 11 '15 at 05:44

Mine problem was in BundleConfig.cs file in App_Start. My BindleConfig.cs file was looking previously like following

bundles.Add(new ScriptBundle("~/Scripts/ui-js").Include(
                                 "~/Scripts/ui-js/jquery.min.1.11.1.js"
                                 , "~/Scripts/ui-js/bootstrap.min.js"
                                 , "~/Scripts/ui-js/bootstrap-slider.js"
                                 , "~/Scripts/ui-js/bootstrap-lightbox.js"
                                 , "~/Scripts/ui-js/common-script.js"
                                 , "~/Scripts/ui-js/html5.js"
                                 , "~/Scripts/ui-js/jquery.colorbox.js"
                                 , "~/Scripts/ui-js/respond.src.js"
                                 , "~/Scripts/ui-js/angular.min.js"
                                 , "~/Scripts/ui-js/bootstrap.js"
                                 ,"~/Scripts/ui-js/jRate.min.js"
                                 , "~/Scripts/ui-js/jcrop.min.js"
                                 ));

And my Layout page had

@Scripts.Render("~/Scripts/ui-js")

After googling i found the solution as you cant use same folder structure for new ScriptBundle() virtual path.

So i changed above to this

 bundles.Add(new ScriptBundle("~/Scripts/ppScript").Include(
                                 "~/Scripts/ui-js/jquery.min.1.11.1.js"
                                 , "~/Scripts/ui-js/bootstrap.min.js"
                                 , "~/Scripts/ui-js/bootstrap-slider.js"
                                 , "~/Scripts/ui-js/bootstrap-lightbox.js"
                                 , "~/Scripts/ui-js/common-script.js"
                                 , "~/Scripts/ui-js/html5.js"
                                 , "~/Scripts/ui-js/jquery.colorbox.js"
                                 , "~/Scripts/ui-js/respond.src.js"
                                 , "~/Scripts/ui-js/angular.min.js"
                                 , "~/Scripts/ui-js/bootstrap.js"
                                 ,"~/Scripts/ui-js/jRate.min.js"
                                 , "~/Scripts/ui-js/jcrop.min.js"
                                 ));

And in my Layout page i called it as

@Scripts.Render("~/Scripts/uiScript")

NOTE: You need to do this same with your CSS and modernizr bundle too :) Hope it help someone.

`@Scripts.Render("~/Scripts/uiScript")` Or you've called it as `@Scripts.Render("~/Scripts/ppScript")` .??? — Chirag, May 08 '17 at 06:47

Uncaught SyntaxError: Unexpected token < ERROR during bundle creation in IIS

1 Answers1