我正在创建一个ASP.NET单页面应用程序,并且有一个require.js配置文件,它在应用程序启动时运行,引用jQuery,Sammy.js和knockout.js。我为三个第三方库创建了填充程序,以允许我在全局级别访问它们:
require.config({
paths: {
"jquery": "/Scripts/jquery-2.1.4.min",
"sammy": "/Scripts/sammy-0.7.5.min",
"knockout": "/Scripts/knockout-3.3.0",
"text": "/Scripts/text",
"appVm": "/Scripts/app/appViewModel"
},
shim: {
"jquery": {
exports: "$"
},
"sammy": {
deps: ["jquery"],
exports: "Sammy"
},
"knockout": {
deps: ["jquery"],
exports: "ko"
}
},
priority: ["text", "app"],
});
define(["knockout", "appVm", "sammy"], function(ko, appVm, sammy) {
var vm = new appVm();
ko.applyBindings(vm);
var app = sammy(function() {
this.get("#Dashboard", function() {
//Dashboard-related logic here
});
});
app.run("#Dashboard");
});
我能够实例化我的knockout viewmodel并将其绑定到页面。但是,当我尝试访问全局变量" ko"要在Chrome Developer控制台中进行淘汰调试,不会定义任何内容。
我如何获得" ko"用于在Chrome中调试的对象?
答案 0 :(得分:2)
首先,传递给RequireJS的配置是错误的。
priority
是RequireJS 1.x选项,RequireJS 2.x无法识别。 shim
是RequireJS 2.x选项,RequireJS 1.x无法识别。很可能你正在运行2.x而priority
什么也没做。
此外,jQuery和Knockout都不需要shim
配置。如果对需要它的模块使用shim
,则会得到未定义的行为。未定义的行为就是“未定义”。也许它今天有效,也许它没有。也许它今天有效,但是从现在起3个星期,当你向项目中添加一个新库时它就不再起作用了。
至于获取对模块的全局引用,您可以执行Anish Patel推荐的操作。它将工作,但我几乎从不这样做。如果我正在调试某些东西并且我必须获得对模块的引用,那么:
如果我想要的模块已经加载,那么我利用了RequireJS为CommonJS兼容性提供的伪同步require
,并在控制台上使用:
foo = require('foo')
否则,我这样做:
require(['foo'], function (foo_) { foo = foo_; });
这是一个异步调用,但我从来没有必要等待它完成。如果您希望获得分配已完成的可视指示,则始终可以在分配后添加console.log
语句。
我不想进入我的代码并添加一个语句来将模块泄漏到全局空间中,我可能会忘记稍后删除。即使我确信我不会忘记,这意味着进入代码,重建应用程序并重新加载页面。
答案 1 :(得分:1)
您可以将ko对象从主函数中公开为全局,如下所示:
define(["knockout", "appVm", "sammy"], function(ko, appVm, sammy) {
// expose ko as global
window.ko = ko;
var vm = new appVm();
ko.applyBindings(vm);
var app = sammy(function() {
this.get("#Dashboard", function() {
//Dashboard-related logic here
});
});
app.run("#Dashboard");
});
另外,您可能想要查看框架DurandalJS它是一个非常好的框架,它使用requirejs,KnockoutJS和JQuery。它有自己的路由功能和良好的应用程序生命周期。