2

我在http://kilon.org/blog/2012/08/build-backbone-apps-using-requirejs/关注 Uzi Kilon 的 BackboneJS/RequireJS/backbone.LocalStorage 示例。

当我git clone https://github.com/uzikilon/Todos它工作得很好 - 但它使用旧版本的backbone.localstorage。但是,如果我lib/backbone.localStorage用较新的版本替换http://cdnjs.cloudflare.com/ajax/libs/backbone-localstorage.js/1.1.0/backbone.localStorage-min,那么我会在这里得到“Uncaught TypeError: undefined is not a function”:https ://github.com/uzikilon/Todos/blob/master/js/models/Todo.js#L3 - 为什么?我认为这与http://requirejs.org/docs/api.html#config-shim的棘手细节有关,或者可能是这个:http ://blog.mostlystatic.com/2013/01/backbone-localstorage -uncaught.html

require.config({
  baseUrl: "./js/",
  paths: {
    jquery: 'lib/jquery-1.8.2',
    underscore: 'lib/underscore-1.4.2',
    backbone: 'lib/backbone-0.9.2',
//    'backbone.localStorage': 'lib/backbone.localStorage'
    'backbone.localStorage': 'http://cdnjs.cloudflare.com/ajax/libs/backbone-localstorage.js/1.1.0/backbone.localStorage-min'

  },
  shim: {
    underscore: {
      exports: "_"
    },
    backbone: {
      deps: ['underscore', 'jquery'],
      exports: 'Backbone'
    },
    'backbone.localStorage': {
      deps: ['backbone'],
      exports: 'Backbone'
    }
  }
});
4

1 回答 1

9

问题在于最新的 Backbone localStorage 与 AMD 兼容,而该示例中的版本不是,因此是 shim 配置。

修复

删除shimbackbone.localStorage 的配置,您将不再需要它:

'backbone.localStorage': {
  deps: ['backbone'],
  exports: 'Backbone'
}

然后,Todo.js将定义调用从:

define(['underscore', 'backbone.localStorage'], function(_, Backbone) {

到:

define(['underscore', 'backbone', 'backbone.localStorage'], function(_, Backbone) {

为什么?

垫片exports配置被用来表示“当我要求使用主干.localStorage 时,将主干归还给我”。

这允许“backbone.localStorage”在 Todo 模块中简单地用作主干。

但现在backbone.localStorage支持 AMD 并从define调用中显式返回一个值。所以BackboneTodo.js 中的值不再是 Backbone 库,而实际上是一个构造函数Backbone.LocalStorage

据我了解,shimAMD 模块的配置被忽略,或者至少不应该使用:

仅使用其他“填充”模块作为填充脚本的依赖项,或没有依赖项的 AMD 库,并在它们也创建全局(如 jQuery 或 lodash)之后调用 define()。否则,如果您使用 AMD 模块作为 shim 配置模块的依赖项,则在构建之后,该 AMD 模块可能直到构建中的 shimed 代码执行后才被评估,并且将发生错误。最终的解决方法是升级所有填充代码以具有可选的 AMD define() 调用。

为了解决问题,需要在 Todo.js 中添加额外的依赖项,以便回调参数匹配。

希望这是有道理的。

于 2013-08-04T12:02:21.697 回答