捆绑JavaScript课程Uncaught SyntaxError:意外的令牌<

时间:2013-07-15 17:05:43

标签: javascript asp.net-mvc-4 bundling-and-minification

使用mvc4课程的捆绑功能

  

未捕获的SyntaxError:意外的标记<

加载。使用debug="true",一切都像排除的那样。

如何解决错误或者我是否可以仅针对脚本禁用捆绑功能?

解决
将包名称重命名为与任何目录

不匹配

3 个答案:

答案 0 :(得分:8)

在回答导致此错误的原因的问题之前,您必须先确定错误发生的位置。捆绑时代码语法的唯一区别是它被缩小了。一种非常简单的方法是使用Bundle而不是ScriptBundle

        var thirdParty = new Bundle("~/bundles/thirdParty").Include(
            "~/Scripts/jquery-{version}.js",
            "~/Scripts/bootstrap.js",
            "~/Scripts/jquery-ui-{version}.js",
            "~/Scripts/jquery.mockjson.js",
            "~/Scripts/jQuery.XDomainRequest.js",
            "~/Scripts/knockout-{version}.js"
            );

        thirdParty.Transforms.Clear();

        bundles.Add(thirdParty);

现在,如果您有多个JavaScript捆绑包,请逐个执行此操作,直到您拥有罪魁祸首捆绑包。

我发现调试这些问题的唯一方法是将你的捆绑包拆分成两半以进一步分解:

        var thirdParty1 = new Bundle("~/bundles/thirdParty1").Include(
            "~/Scripts/jquery-{version}.js",
            "~/Scripts/bootstrap.js",
            "~/Scripts/jquery-ui-{version}.js"
            );

        bundles.Add(thirdParty1);

        var thirdParty2 = new ScriptBundle("~/bundles/thirdParty2").Include(
            "~/Scripts/jquery.mockjson.js",
            "~/Scripts/jQuery.XDomainRequest.js",
            "~/Scripts/knockout-{version}.js"
            );

        bundles.Add(thirdParty2);

请注意,我们仅对两个捆绑中的一个禁用缩小版本 - thirdParty1。请务必更新您的@Scripts.Render以指向您的新捆绑包。当你构建和重新加载时,你将继续得到错误,或者你不会,然后将知道哪一半包含麻烦的代码。但请确保并在两个方面进行测试,在我的示例中缩小thirdParty1和取消thirdParty2,反之亦然,以确定其他内容不会发生。您还可能希望保留DevTools或您打开的任何浏览器调试器,并查看捆绑包的来源以确保它们按预期运行。

如果您有很多脚本,请继续从已缩小的捆绑包(在我的情况下为thirdParty1)中移动脚本(thirdParty2),无论是一次还是块。请记住在中间重建,并注意不要更改脚本的包含顺序。

这应该至少让你找到有问题的文件 - 并希望搜索“<”会得到你的答案。

希望有所帮助。

答案 1 :(得分:0)

他的解决方案帮助了我,将包重命名为与目录不同。我是这样分组我的:

@Styles.Render("~/jqueryui")
@Scripts.Render("~/jqueryui")

使用jquery UI样式以这种方式执行时似乎存在一个错误。我刚刚将包重命名为:

@Styles.Render("~/jqueryuiz")
@Scripts.Render("~/jqueryui")

这为我解决了这个问题。所以脚本似乎不会以这种方式受到影响,类似的捆绑包也没有,我加载了大约20套捆绑包,这是唯一导致问题的捆绑包。

答案 2 :(得分:0)

我的问题: 我在我的Content文件夹中引用脚本文件,但其包名称为~Scipts。我将我的包重命名为~DefaultScripts,这解决了我的问题。我不想引用Scripts文件夹,但它是在那里而不是我的Content文件夹。

  bundles.Add(New ScriptBundle("~/Scripts").Include(
              "~/Content/assets/global/plugins/jquery.min.js",
              "~/Content/assets/global/plugins/bootstrap/js/bootstrap.min.js",
              "~/Content/assets/global/plugins/js.cookie.min.js",
              "~/Content/assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js",
              "~/Content/assets/global/plugins/jquery.blockui.min.js",
              "~/Content/assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js",
              "~/Content/assets/global/scripts/app.js",
              "~/Content/assets/layouts/layout2/scripts/layout.min.js",
              "~/Scripts/custom.js"))




  bundles.Add(New ScriptBundle("~/DefaultScripts").Include(
              "~/Content/assets/global/plugins/jquery.min.js",
              "~/Content/assets/global/plugins/bootstrap/js/bootstrap.min.js",
              "~/Content/assets/global/plugins/js.cookie.min.js",
              "~/Content/assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js",
              "~/Content/assets/global/plugins/jquery.blockui.min.js",
              "~/Content/assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js",
              "~/Content/assets/global/scripts/app.js",
              "~/Content/assets/layouts/layout2/scripts/layout.min.js",
              "~/Scripts/custom.js"))