2

RequireJS を使用して KnockoutJS プラグインである KnockoutFire を読み込もうとしています。1つのファイルのみです: https://github.com/hiroshi/knockoutFire/blob/master/knockoutFire.js

プラグインは次の 2 つのことを行います。

  1. グローバル変数「KnockoutFire」を定義します
  2. コア KnockoutJS ("ko") lib を拡張します

したがって、このライブラリを適切にロードするには、グローバル変数「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://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 に答える