我目前在将EnableOptimization布尔值设置为true的情况下运行Firefox时遇到问题。目前,所有其他浏览器都在这种设置下完美运行,只有Firefox出现了一致的jQuery问题。如果我关闭EnableOptimization,它也可以在那里运行。
基本上,我的解决方案中有两个捆绑包。第一个bundle用作整个应用程序的基础,它在_Layout.cshtml部分视图中被调用。这里的文件有jQuery 1.11.3、jQuery UI、AngularJS等。第二个捆绑包是对特定视图的脚本进行分组。以下是BundleConfig文件的一般结构:
public static void RegisterBundles(BundleCollection bundles)
{
bundles.FileSetOrderList.Clear();
bundles.IgnoreList.Clear();
bundles.UseCdn = true;
Bundle baseBundle = new Bundle("~/bundles/Base");
baseBundle.Include("~/Scripts/jquery-1.11.3.js")
// Includes omitted due to large number of scripts
Bundle indexBundle = new Bundle("~/bundles/Index");
// Includes omitted due to large number of scripts
bundles.Add(baseBundle);
bundles.Add(indexBundle);
#if !DEBUG
BundleTable.EnableOptimizations = true;
#elif DEBUG
BundleTable.EnableOptimizations = true;
#endif
}
捆绑包本身包含30个或更多的脚本,所以我无法告诉你我得到了多少错误,但这些错误都会导致相同的问题,这是我的解决方案中jQuery的问题。一些例子:
Ex.1:
TypeError: $.fn is undefined
().height("")}}function customScroll({$.fn.mCustomScrollbar&&$(".withScroll").e...
Ex.2:
TypeError: $(...).on is not a function
function toggleBuilder() {
$('.builder-toggle').on('click', function () {
if ($('#builder').hasClass('open')) $('#builder').removeClass('open');
else $('#builder').addClass('open');
});
}
$(document).ready(function () {
toggleBuilder();
});
大多数错误都发生在我购买的模板上,所以我宁愿不直接接触这些脚本。
这种行为对我来说似乎很奇怪,因为jQuery是这个页面上加载的第一个脚本,所以在我看来,任何脚本在加载之前都不可能使用jQuery。更奇怪的是,只是火狐导致了这个错误。
你知道原因是什么吗?也许其他脚本正在覆盖jQuery?我该如何轻松识别?
更新:经过一番研究,我决定提醒大家注意$的含义。在Chrome和其他浏览器中,它会返回正确的代码。然而,在Firefox中,它返回的是:
function (out,values,parent,xindex,xcount,xkey) {
var c0=values, a0=Array.isArray(c0), p0=parent, n0=xcount, i0=xindex, k0, v;
if ((v=values['prefix']) != null) out.push(v+'')
out.push('/')
if ((v=values['entityName']) != null) out.push(v+'')
}
事实证明,这是Sencha ExtJS代码。现在是我最新的问题:这怎么可能只有FireFox有这个问题,我该如何解决这个问题?回想一下,除非必要,否则我宁愿不接触模板中的任何现有脚本。
事实证明ExtJS脚本没有正确缩小,这就是Firefox出现这些错误的原因。在我的解决方案中,其他一切都还可以。