2

我正在尝试加载 KnockoutFire,这是一个使用 RequireJS 的 KnockoutJS 插件。它只有 1 个文件:https ://github.com/hiroshi/knockoutFire/blob/master/knockoutFire.js

该插件做了两件事:

  1. 定义全局变量“KnockoutFire”
  2. 扩展核心 KnockoutJS ("ko") 库

因此,要正确加载此库,它需要能够通过全局变量“ko”访问 KnockoutJS。问题是我正在使用适当的 AMD 加载 KnockoutJS,并且没有可供 KnockoutFire 参考的全局“ko”。我曾尝试同时填充库和其他各种技巧以使其正常工作,但我很难过。一切都会产生错误:

ReferenceError: ko is not defined

这是我正在使用的内容:

require.config({
    enforceDefine: false,
    baseUrl: 'assets/js/',
    paths: {
        'knockout': '//ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1'
    },
    shim: {
        'knockout': { exports: 'ko' },
        'knockoutfire': { exports: 'KnockoutFire', deps: ['knockout'] }
    },
    waitSeconds : 15
});


require(['knockoutfire'], function() {
    log(KnockoutFire);
});

我也尝试过做一些奇怪的事情,比如:

require(['knockout'], function(ko) {
    require(['knockoutfire'], function(kofire, ko) {
        log(KnockoutFire);
    });
});

或者:

define(['knockout'], function(ko) {
    require(['knockoutfire'], function(ko) {
        log(KnockoutFire);
    });
});

如果我下载第三方库并将其添加到其中:

define(['knockout'], function(ko) {
    <!--- third party lib --->
});

一切正常。

有没有办法在不修改第三方库的情况下达到相同的结果?

4

4 回答 4

2

当您需要这些脚本时,请使用命令!插件http://requirejs.org/docs/1.0/docs/api.html#order以确保您在 knockoutfire 之前加载淘汰赛。即在您的文件中:

define('require','exports','order!knockout','order!knockoutfire',
         function(req,exp,knockout,knockoutfire){
            //trimmed 
于 2013-04-26T01:21:09.320 回答
2

我认为仔细查看http://knockoutjs.com/downloads/knockout-2.2.1.debug.js可能会揭示答案。有特殊的 AMD 处理,我不确定它是否与我尝试过的东西(使用 shim 和导出)配合得很好。

这个黑客虽然有效。bootstrap我们基本上用一个模块控制全局分配。

require.config({
    enforceDefine: false,
    baseUrl: 'assets/js/',
    paths: {
        'jquery': 'http://code.jquery.com/jquery-1.9.1',
        'knockout': 'http://knockoutjs.com/downloads/knockout-2.2.1.debug',
        'knockoutfire': 'https://raw.github.com/hiroshi/knockoutFire/master/knockoutFire'
    },
    waitSeconds: 15
});

define("bootstrap", ['jquery', 'knockout'], function ($, ko) {
    console.log("bootstrap", "jQuery " + $.fn.jquery, ko);
    window.ko = ko;
    var dfd = $.Deferred();
    require(['knockoutfire'], function (kof) {
        dfd.resolve(KnockoutFire);
    });
    return dfd.promise();
});

require(['bootstrap'], function (bootstrap) {
    bootstrap.then(function () {
        console.log("ko", ko, "KnockoutFire", KnockoutFire);
    });
});

输出:

bootstrap jQuery 1.9.1  Object {exportSymbol: function, exportProperty: function, version: "2.2.1", utils: Object, cleanNode: function…}
ko  Object {exportSymbol: function, exportProperty: function, version: "2.2.1", utils: Object, cleanNode: function…}
KnockoutFire  Object {version: "0.0.3", utils: Object, observable: function, mapObservable: function}

这里的例子

于 2013-04-26T13:51:48.223 回答
1

这个答案的灵感来自@Paul 的回答:

define("globalko", ['knockout'], function (ko) {
    window.ko = ko;
});

require(['knockoutfire', 'globalko'], function (kofire) {
    console.log(kofire);
});

这会加载两个库而不会出错。

有人对 KO 或 KOFire 有什么建议可以让他们的库更容易与 AMD 一起使用吗?

于 2013-04-26T18:00:45.393 回答
0

假设您在 knockoufire 中有类似的内容

define('require','exports','ko',function(req,exp,ko){
//trimmed 

在 knockoutfire 之上尝试以下行:

var ko = ko.ko
于 2013-04-26T01:10:05.587 回答