我有一个主干应用程序正常运行。它旨在用作第 3 页中的小部件。不幸的是,我刚刚意识到其中一个页面已经加载了 Backbone/underscore。
我收到这样的错误:
Uncaught TypeError: Cannot read property 'extend' of undefined
这通常出现在先前未加载下划线时。
我的典型 View 是这样的:(正常的 Backbone View )
./view1.js
var Backbone = require('backbone')
var _ = require('underscore')
var $ = require('jquery')
Backbone.$ = $
module.exports = Backbone.View.extend({
events: {
},
initialize: function () {
},
render: function () {
}
})
那么我只需要调用它:
var View1 = require('view1')
var view1Instance = new View1(...)
谢谢你的帮助 :)
调查后编辑:
通过调试器运行时,
Backbone
变量似乎是一个空对象,而不是 Backbone。好像 require('backbone')
刚刚返回 {}
编辑2:
似乎与这个问题有关:https://github.com/substack/node-browserify/issues/790
最佳答案
Backbone 和 Requirejs ( as indicated by thlorenz here ) 的问题
- backbone looks for
define
before looking for module.exports- requirejs works with globals which is not good practice and in this case causes problems since it affects everything that runs in the same browser tab
他建议将所有内容都包装在一个范围内并隐藏
define
函数。他还有一个工具可以做到这一点。 browserify-shim
但是,我没有使用它,而是使用 Browserify 的 postBundleCB 选项:(感谢同事)。
在我的
Gruntfile
中:browserify: {
dist: {
src: ['src/app/app.js'],
dest: 'www/app.js',
options: {
postBundleCB: function (err, src, next) {
return next(null, '(function () { var define = undefined; '+src+' })();')
}
}
}
},
这解决了我的问题:)
我没有尝试过 browserify-shim,所以我对它了解不多。
关于backbone.js - 如何解决同一页面上的 browserify(基于 Backbone 的应用程序)和 require.js 之间的冲突?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25999947/