Question

我有一个Backbone应用程序，从我的代码中使用Backbone的不同位置非确定性地获取Backbone is not defined错误。有时它首先加载并加载网站，有时则加载。我使用以下作为我的main.js：

require.config({
  paths: {
    jqueryui: 'libs/jquery/jquery-ui',
    underscore: 'libs/underscore/underscore-min',
    backbone: 'libs/backbone/backbone-min',
    text: 'libs/require/text',
    order: 'libs/require/order',
    searchcollector: 'libs/jquery/searchcollector.plugin',
    guiders: 'libs/jquery/guiders'
  },
  shim: {
    'underscore': {
      exports: '_'
    },
    'backbone': {
      deps: ['underscore'],
      exports: 'Backbone'
    }
  }
});

require([
  'views/app',
  'helpers'
], function(app) {
  var app = window.app = new app();
});

我正在使用

<script data-main="/assets/js/main" src="/assets/js/libs/require/require-jquery.js"></script>

在我的HTML中，所以jQuery加载了require。我从这个（http://stackoverflow.com/questions/8131265/loading-backbone-and-underscore-using-requirejs）SO线程中得到了这个建议，但似乎没有任何工作。 Shim不应该首先加载Backbone，然后让它全局可用吗？任何帮助表示赞赏。

Answer 1

不确定这是否是正确答案，但我注意到您没有将jquery列为Backbone依赖项。虽然Backbone将Underscore列为唯一的硬依赖，但Backbone.View需要jquery或zepto才能工作。

但为什么呢，它似乎在某些时候有效？

可能是因为jQuery是一个AMD模块，当你加载时，它有时会先加载，有时则不加载。当它在Backbone之前加载时，它是可用的，Backbone很高兴。否则，也许是你得到的糟糕结果。

尝试这样的事情：

在你的路径中添加：

jquery: 'libs/require/require-jquery'

在你的垫片中，添加：

'backbone': {
  deps: ['underscore', 'jquery'],
  exports: 'Backbone'
}

让我知道你得到的结果。我从来没有使用过requirejs2.0的垫片功能，所以我很好奇我是否正确理解了更深层的东西。

Answer 2

在我看来，在同一个文件中加载require和jquery是有点hacky。

并设置jquery作为Backbone的deps是错误的，因为Underscore需要jquery，并且它在Backbone之前加载所以正确的方式是这样的

require.config({
  paths: {
     'jquery': 'path to jquery'
    ,'underscore': 'path to underscore'
    ,'backbone': 'path to backbone'
    **other paths...**
  }
  ,shim: {
     jquery: {
      exports: '$'
    }
    ,'underscore': {
      deps: [ 'jquery' ]
      ,exports: '_'
    }
    ,'backbone': {
      deps: [ 'underscore' ]
      ,exports: 'Backbone'
    }
  }
});

最后你的标签脚本将是

<script data-main="/assets/js/main" src="/assets/js/libs/require.js">
</script>

然后你只需要调用你需要的lib

define( [ 'jquery', 'underscore', 'backbone' ],
  function( $, _, Backbone )
  {
    // stuff
  } );

对于一个模型，你可能不需要jquery和下划线，所以只需调用Backbone就可以了

define( [ 'backbone' ],
  function( Backbone )
  {
    // Backbone.extend ?
  } );

骨干未定义

2 个答案: