我正在使用require.js来帮助组织基于Backbone.js的应用程序。
我正试图找出正确的方法来使用一个与require.js不兼容的第三方JavaScript库。
有问题的库是backbone-tastypie.js。该库的基本作用是monkeypatch一些Backbone原型方法，以提供更简单的TastyPie Django REST框架支持。它通过直接操作全局命名空间中的Backbone对象来实现这一点。
但是，由于我将Backbone.js作为require.js模块使用，因此当此库尝试访问它时，它是不可用的。
我该如何在Backbone范围内导入此backbone-tastypie？
更新：我已经复制了一个兼容AMD的backbone-tastypie，称为backbone-tastypie-amd。
sander的解决方案虽然可行，但每次想要使用backbone时都要进行整个嵌套式require有点烦人。
backbone-tastypie被称为“传统脚本”。你可以通过4种方法解决这个问题。
Make backbone-tastypie AMD compatible yourself. You can do this in one of two ways. Option 1 would be to never include backbone directly - only backbone-tastypie. Then modify backbone tastypie to ensure backbone is required.
var root = this;
var Backbone = root.Backbone;
if (!Backbone && (typeof require !== 'undefined')) Backbone = require('backbone').Backbone;
However this isn't very nice because essentially it will start downloading backbone after backbone-tastypie has loaded (synchronous). It also doesn't give requirejs the full understanding of how these modules relate, and thats the point right? So lets wrap backbone-tastypie in a define():
(function (factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as an anonymous module.
define(['backbone'], factory);
} else {
// RequireJS isn't being used. Assume backbone is loaded in <script> tags
factory(Backbone);
}
}(function (Backbone) {
//Backbone-tastypie contents
}));
This is by far the best option out of everything in this answer. RequireJS knows about the dependencies and it can resolve them, download them and evaluate them correctly. It's worth noting that Backbone itself loads underscore using option 1 and does not define itself as a module, which is pretty bad. You can get the AMD optimised version of backbone right here. Assuming you are using this AMD version you can now go right ahead and require backbone-tastypie in your app (either by requiring it in a define() or the actual require() function). You dont have to include backbone or underscore either, as those dependencies are resolved by requirejs.
Use the require.js ordering plugin. This forces things to load in order (still asynchronous in some respects as it downloads them whenever, but evaluates in correct order)
require(["order!backbone.js", "order!backbone-tastypie.js"], function () {
//Your code
});
Put backbone.js in the priority config. This forces backbone and its dependencies to always load first no matter what.
Append backbone-tastypie to the same file as backbone.js. Every time backbone is loaded, so is backbone tastypie. Hacky? Yes. But this is very similar to the recommended way of using jquery with requireJS (jquery plugins need jquery to be loaded - much like backbone-tastypie needs backbone to be loaded).
require.config({
shim: {
'underscore': {
exports: '_'
},
'backbone': {
deps: ['underscore','jquery'],
exports: 'Backbone'
},
'backbone-tastypie': {
deps: ['backbone']
}
}
);
require(["myCustomTastyPiePlugin.js"], function () {
//This callback is called after the one script finish loading.
require(["one.js", "two.js", "three.js"], function () {
//This callback is called after the three scripts finish loading.
// all your code goes here...
});
});