加载骨干网和用下划线RequireJS [英] Loading Backbone and Underscore using RequireJS

问题描述

我试图加载具有RequireJS骨干和下划线（以及jQuery的）。随着骨干网和下划线的最新版本，它似乎有点棘手。其一，下划线会自动将自己注册为一个模块，但骨干假定下划线全球可用。我还要指出，骨干似乎并没有将其自身注册为一个模块，这使得它与其他库的实物不一致。这是我能想出的最好main.js与作品：

I'm trying to load Backbone and Underscore (as well as jQuery) with RequireJS. With the latest versions of Backbone and Underscore, it seems kind of tricky. For one, Underscore automatically registers itself as a module, but Backbone assumes Underscore is available globally. I should also note that Backbone doesn't seem to register itself as a module which makes it kind of inconsistent with the other libs. This is the best main.js I could come up with that works:

require(
{
    paths: {
        'backbone': 'libs/backbone/backbone-require',
        'templates': '../templates'
    }
},
[
    // jQuery registers itself as a module.
    'http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js',

    // Underscore registers itself as a module.
    'http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.2.1/underscore-min.js'
], function() {

    // These nested require() calls are just due to how Backbone is built.  Underscore basically says if require()
    // is available then it will automatically register an "underscore" module, but it won't register underscore
    // as a global "_".  However, Backbone expects Underscore to be a global variable.  To make this work, we require
    // the Underscore module after it's been defined from within Underscore and set it as a global variable for
    // Backbone's sake.  Hopefully Backbone will soon be able to use the Underscore module directly instead of
    // assuming it's global.
    require(['underscore'], function(_) {
        window._ = _;
    });

    require([
        'order!http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.5.3/backbone-min.js',
        'order!app'
    ], function(a, app) {
        app.initialize();
    })
});

我要指出的是，虽然它的工作原理，优化扼流圈就可以了。我收到以下内容：

I should mention that, while it works, the optimizer chokes on it. I receive the following:

Tracing dependencies for: main
js: "/home/httpd/aahardy/requirejs/r.js", line 7619: exception from uncaught JavaScript throw: Error: Error: Error evaluating module "undefined" at location "/home/httpd/aahardy/phoenix/trunk/ui/js/../../ui-build/js/underscore.js":
JavaException: java.io.FileNotFoundException: /home/httpd/aahardy/phoenix/trunk/ui/js/../../ui-build/js/underscore.js (No such file or directory)
fileName:/home/httpd/aahardy/phoenix/trunk/ui/js/../../ui-build/js/underscore.js
lineNumber: undefined
http://requirejs.org/docs/errors.html#defineerror
In module tree:
    main

是否有处理这种更好的办法？谢谢！

Is there a better way of handling this? Thanks!

推荐答案

RequireJS 2.X 现在有机地解决了非AMD模块，如骨干和放大器;强调要好得多，使用新的 垫片 配置。

RequireJS 2.X now organically addresses non-AMD modules such as Backbone & Underscore much better, using the new shim configuration.

的垫片配置简单易用：（1）状态之一的依赖（ DEPS ），如果有的话，（其可以是从路径的配置，或者可以是有效路径本身）。 （2）（可选）指定要从你垫补的文件，它应该被出口到需要它的模块功能的全局变量名。 （如果你不指定出口，那么你需要只使用全球，因为那什么事都传递到您的要求/定义函数）。

The shim configuration is simple to use: (1) one states the dependencies (deps), if any, (which may be from the paths configuration, or may be valid paths themselves). (2) (optionally) specify the global variable name from the file you're shimming, which should be exported to your module functions that require it. (If you don't specify the exports, then you'll need to just use the global, as nothing will get passed into your require/define functions.)

下面是垫片一个简单的例子使用加载骨干。它还增加了下划线出口，即使它没有任何依赖关系。

Here is a simple example usage of shim to load Backbone. It also adds an export for underscore, even though it doesn't have any dependencies.

require.config({
  shim: {
    underscore: {
      exports: '_'
    },
    backbone: {
      deps: ["underscore", "jquery"],
      exports: "Backbone"
    }
  }
});

//the "main" function to bootstrap your code
require(['jquery', 'underscore', 'backbone'], function ($, _, Backbone) {   // or, you could use these deps in a separate module using define

});

^{的注：的这种简化的code假定jQuery的骨干，并强调在一个名为jquery.js和，Backbone.js的和underscore.js中的文件同一目录下这个主code（成为BASEURL的要求）。如果不是这种情况下，你需要使用路径配置。}

^{Note: this simplified code assumes that jquery, backbone and underscore are in files named "jquery.js", "backbone.js" and "underscore.js" in the same directory as this "main" code (which becomes the baseURL for require). If this isn't the case, you'll need to use a paths config.}

我个人认为与内置的垫片的功能，不使用骨架放的分支版本的优点;下划线超过使用其它流行的答案推荐AMD叉的好处，但无论哪种方式工作。

I personally think with the built-in shim functionality, the advantages of not using a forked version of Backbone & Underscore outweigh the benefits of using the AMD fork recommended in the other popular answer, but either way works.

这篇关于加载骨干网和用下划线RequireJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！