1

我正在尝试使用 Jquery Mobile、Backbone 和 RequireJS 创建一个站点。但我遇到的问题是网站随机中断以及中断不同的原因:

  • JQuery 未定义
  • 主干未定义
  • 未定义主干的扩展视图
  • 等等等等

而且我无法确定我们的原因,因为它有时会起作用,但是当我刷新它时,它突然不起作用。我正在像这样加载我的代码(库后跟视图):

requirejs(["/js/libs/jquery-1.8.3.min", "/js/libs/jquery.mobile-1.2.0.min", "/js/libs/underscore-1.4.3", "/js/libs/json2", "/js/libs/backbone.0.9.9"], function($,JQM, underscore, json2, bb) {

});

requirejs(["/js/views/pageview", '/js/views/home'], function(util) {

    HomeView = new HomeView({el : '#home', 'id' : 'home'})
});

我这样做是不是做错了什么?

4

1 回答 1

4

jQuery Mobile、Backbone 和 Underscore 等库不是 AMD 模块,只是普通的旧 javascript 文件。而且因为它们不是模块,它们不声明依赖关系,它们只是希望在全局范围内找到$或。_

RequireJS 的加载顺序是不确定的——所以不知道哪个会先加载。如果首先评估 Backbone,它将找不到window._它正在寻找的并崩溃。

RequireJS 通过 shim 配置(请参阅文档)支持非 AMD 模块,它允许您声明这些库之间的依赖关系。配置 shim 后,RequireJS 知道如何在依赖库之前加载依赖库。

带有 shim 元素的典型 RequireJS 配置如下所示:

requirejs.config({
  //libraries
  paths: {
      jquery:       'libs/jquery/jquery',
      backbone:     'libs/backbone/backbone',
      underscore:   'libs/underscore/underscore',
      jquerymobile: 'libs/jquery.mobile-1.2.0/jquery.mobile-1.2.0',
  },

  //shimming enables loading non-AMD modules
  //define dependencies and an export object
  shim: {
      jquerymobile: {
          deps: ['jquery'],
          exports: 'jQuery.mobile'
      },
      underscore: {
          exports: '_'
      },
      backbone: {
          deps: ['jquerymobile', 'jquery', 'underscore'],
          exports: 'Backbone'
      }
  }
});

paths部分不是强制性的,您可以只使用文件路径作为该shim部分中的键。但是,当您使用paths别名时,您可以使用短名称而不是整个路径导入这些库:

define(['jquery', 'backbone'], function($, Backbone) { ... });
于 2013-01-07T22:46:48.667 回答