这是我第一次尝试使用 Marionette。我正在尝试将 Marionette 应用程序实例化为 requirejs 模块。我一直在关注 Marionette.js wiki 上的《Using Marionette with Require js》文章:-
https://github.com/marionettejs/backbone.marionette/wiki/Using-marionette-with-requirejs
我认为我拥有所有的垫片、依赖项和文件,因为我能够在同一个地方实例化 View 、模型等而不会出现错误,但我无法找出我的应用程序的问题。任何帮助或指导将不胜感激!
这是我的index.html:-
<!DOCTYPE html>
<html>
<head>
<title>Marionette Structure and Require AMD Proto</title>
<link rel="stylesheet" type="text/css" href="css/styles.css">
</head>
<body>
<div id="nav">
</div>
<div id="mainContent">
</div>
<script language="javascript">
// convenience function, because console.log throws errors and crashes IE
// this way you don't need to all logs to test in IE
function trace(msg){
try{
console.log(msg);
}catch(e){
// suppressed error
}
}
</script>
<script src="js/lib/require.js" data-main="app.js"></script>
</body>
</html>
这是我的 app.js:-
require.config({
paths : {
backbone : 'js/lib/backbone',
underscore : 'js/lib/underscore',
jquery : 'js/lib/jquery',
marionette : 'js/lib/backbone.marionette'
},
shim : {
jquery : {
exports : 'jQuery'
},
underscore : {
exports : '_'
},
backbone : {
deps : ['jquery', 'underscore'],
exports : 'Backbone'
},
marionette : {
deps : ['jquery', 'underscore', 'backbone'],
exports : 'Marionette'
}
}
})
require(
["jquery",
"underscore",
"backbone",
"marionette",
"js/shell/shellapp"
],
function($, _, Backbone, Marionette, ShellApp) {
$(function() {
new ShellApp();
trace("ShellApp: "+ShellApp);
});
}
);
最后这是我的 shellapp.js:-
define( ["marionette"], function (Marionette) {
// set up the app instance
var ShellApp = new Marionette.Application();
// configuration, setting up regions, etc ...
ShellApp.addRegions({
nav: '#nav',
main: '#mainContent'
});
ShellApp.on('initialize:after', function(){
trace("initialize:after");
});
// export the app from this module
return ShellApp;
});
把它们放在一起,我在 app.js 第 42 行得到“Uncaught TypeError: object is not a function”
非常感谢所有走到这一步的人!
山姆
最佳答案
我的回答太长,无法发表评论!
您正在导出构造的对象,而不是构造函数本身:
var ShellApp = new Marionette.Application()
...
return ShellApp;
这正是导入的内容,因此您无需创建另一个新
。
首先,我会将 ShellApp
重命名为 shellApp
以表示一个实例,而不是一个构造函数(这是常见的命名约定)。我认为教程中他们打破了这个约定,这是相当具有误导性的:
MyApp = new Backbone.Marionette.Application();
(假设我在这里的路线是正确的)。
我现在假设您只是在应用程序的生命周期内传递 Marionette.Application
的单个实例。
在教程中,它 shows导出newed-up Marionette.Application
(与您所做的相同),但在导入时并不显示它实际被使用。导入对象后,您可以访问它的属性,例如:
shellApp.addInitializer(function(options){
// stuff
});
更多 here .
关于javascript - 尝试使用 requirejs 实例化 Marionette 应用程序时出现“对象不是函数”错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15947681/