我们有一个Rails应用程序,其中我们的应用程序依赖项包含在application.js的html头中:

//= require jquery
//= require analytics
// other stuff...

然后在各个页面上,我们在页面底部都有一个analytics的脚本标签:
<script>
  analytics.track('on that awesome page');
</script>

这通常可以正常工作,但是偶尔我们会在Chrome 43上看到错误analytics is not defined。由于应该同步加载所有内容,因此似乎应该可以立即使用,但是我将脚本更改为:
<script>
  $(document).ready(function () {
    analytics.track('on that awesome page');
  });
</script>

现在,我们偶尔会看到$ is not defined。我们看不到来自同一IP的其他任何错误,否则我怀疑application.js中出了点问题。还有其他想法为什么会中断?您可以看到一个示例页面here

完整的application.js:
// Polyfills
//= require es5-shim/es5-shim
//= require es5-shim/es5-sham
//= require polyfills
//
// Third party plugins
//= require isMobile/isMobile
//= require jquery
//
//= require jquery.ui.autocomplete
//= require jquery.ui.dialog
//= require jquery.ui.draggable
//= require jquery.ui.droppable
//= require jquery.ui.effect-fade
//= require jquery.ui.effect-slide
//= require jquery.ui.resizable
//= require jquery.ui.tooltip
//
//= require jquery_ujs
//= require underscore
//= require backbone
//= require backbone-sortable-collection
//= require bootstrap
//= require load-image
//= require react
//= require react_ujs
//= require classnames
//= require routie
//= require mathjs
//= require moment
//= require stink-bomb
//= require analytics
//
// Our code
//= require_self
//= require extensions
//= require extend
//= require models
//= require collections
//= require constants
//= require templates
//= require mixins
//= require helpers
//= require singletons
//= require actions
//
//= require object
//= require components
//= require form_filler
//= require campaigns
//= require form_requests
//= require group_wizard
//= require step_adder

Chalk = {};
underscore = _;

_.templateSettings = {
  evaluate:    /\{\{(.+?)\}\}/g,
  interpolate: /\{\{=(.+?)\}\}/g,
  escape:      /\{\{-(.+?)\}\}/g
};

moment.locale('en', {
  calendar: {
    lastDay: '[Yesterday at] LT',
    sameDay: '[Today at] LT',
    nextDay: '[Tomorrow at] LT',
    lastWeek: 'dddd [at] LT',
    nextWeek: '[Next] dddd [at] LT',
    sameElse: 'L LT'
  }
});

更新:

我们仍然偶尔会在生产中看到这种情况。在将脚本加载到application.js之前然后在以下位置引用脚本的情况下,我们也看到了它:
javascript_include_tag 'mathjs'
javascript_include_tag 'application'

我们经常看到math is not defined错误。我想知道是否在加载mathjs或其他脚本期间发生错误,从而阻止了该错误的加载,但是这种错误发生在这么多不同的库中,而且这种情况很少发生,因此看起来不太可能发生。我们确实进行了一些调试检查,以查看我们的application.js是否已完全加载,即使在页面稍后访问诸如Jquery之类的东西时,它似乎也没有完全加载。

这样做的目的之一是避免旧的浏览器通知有关脚本运行时间过长的情况,但是我们可能只是放弃并将其全部放入application.js中以避免错误。

最佳答案

如果您不等待加载定义analytics的脚本,或者未定义加载javascript文件的顺序,则可能会发生这种情况。在尝试调用analytics的方法之前,请确保始终加载定义track的脚本。根据您的设置,脚本可能会以随机顺序加载,从而导致这种不可预测的行为。

您试图确保已加载所有内容,但侦听器$(document).ready(function () {});仅确保DOM已准备就绪,而不是分析可用。在这里,您有同样的问题。 $只是jQuery,因此$ is not defined表示尚未加载jQuery。因此,可能是您的脚本在jQuery加载之前就出现了,并试图调用尚未定义的内容。

07-24 09:50
查看更多