Laden von Highcharts über Shim mit RequireJS und Beibehalten der jQuery-Abhängigkeit

Ich versuche, die Highcharts-Bibliothek mit einem Shim in RequireJS zu laden. Beim Laden von Highcharts wird jedoch eine Ausnahme ausgelöst, da nicht auf die abhängigen jQuery-Methoden zugegriffen werden kann.

Die erforderliche Konfiguration sieht folgendermaßen aus:

require.config({
    baseUrl: "js",

    shim: {

        'libs/highcharts/highcharts.src.js': {
            deps: ['jquery'],
            exports: function(jQuery)
            {
                this.HighchartsAdapter = jQuery;

                return this.Highcharts;
            }
        }
    }
});

Die Ausnahme, die ausgelöst wird, ist:

Uncaught TypeError: undefined is not a function

und ist in Bezug auf diese Zeile:

dataLabels: merge(defaultLabelOptions, {

Das Problem ist diemerge call, der sich schließlich wieder jQuery zuordnet (oder einem anderen Adapter, den Highcharts unterstützt; ich verwende jedoch nur jQuery).

Ich weiß nicht genau, wie ich sicherstellen soll, dass Highcharts mithilfe von RequireJS und Shim Zugriff auf jQuery erhält.

Hat schon jemand RequireJS und Highcharts zusammen benutzt? Ich denke, das Problem ist nicht spezifisch für Highcharts, sondern für jede Bibliothek, die andere Arten von Abhängigkeiten aufweist.

Vielen Dank im Voraus für Ratschläge oder Hinweise in die richtige Richtung!

Um einen weiteren Kontext hinzuzufügen, in der Hoffnung, dass jemand, der mit require.js oder shims vertraut ist, helfen kann, ohne zu vertraut mit Highcharts zu sein, finden Sie hier eine Quelle, die dies einrichtetmerge Methode in Highcharts

var globalAdapter = win.HighchartsAdapter,
adapter = globalAdapter || {},

// Utility functions. If the HighchartsAdapter is not defined, 
// adapter is an empty object
// and all the utility functions will be null. In that case they are 
// populated by the
// default adapters below.

// {snipped code}

merge = adapter.merge

// {snipped code}

if (!globalAdapter && win.jQuery) {
    var jQ = win.jQuery;

    // {snipped code}

    merge = function () {
        var args = arguments;
        return jQ.extend(true, null, args[0], args[1], args[2], args[3]);
    };

    // {snipped code}
}

Daswin Objekt ist eine Referenz, auf die gesetzt wurdewindow am Anfang des Skripts. Also dachte ich mir das Hinzufügenwindow.jQuery = jQuery; Wenn Sie die Exportmethode für das Shim verwenden, wird in den Highcharts die jQuery-Referenz abgerufen. aber das tat es nicht.

Auch hier wären alle Einsichten, Informationen, Ratschläge oder Zwischenrufe an dieser Stelle dankbar - ich bin völlig ratlos und beginne zu fragen, ob es sich überhaupt lohnt, ein AMD-Paketsystem in Browser-Javascript zu implementieren.

Nach der Annahme der Antwort vonPabera Im Folgenden hielt ich es für angebracht, meine Frage zu aktualisieren, um zu reflektieren, wie seine Antwort meiner Lösung geholfen hat (obwohl es im Grunde seine Antwort ist).

RequireJS verwendet "Pfade", um Bibliotheken zu finden, die nicht von "AMD" unterstützt werden, und lädt sie auf Ihre Seite. Mit dem Objekt "shim" können Sie Abhängigkeiten für die in Pfaden definierten Bibliotheken definieren. Die Abhängigkeiten müssen geladen werden, bevor requirejs versucht, das abhängige Skript zu laden.

Die Eigenschaft exports bietet einen Mechanismus, mit dem Sie feststellen können, ob die Bibliothek geladen ist. Für Kernbibliotheken wie jquery, backbone, socketio usw. exportieren sie alle eine Variable auf Fensterebene (Backbone, io, jQuery und$, usw). Sie geben einfach diesen Variablennamen alsexports property, und requirejs kann bestimmen, wann die lib geladen wird.

Sobald Ihre Definitionen fertig sind, können Sie verwendenrequirejs' define funktionieren wie erwartet.

Hier ist mein Beispielrequire.config Objekt:

require.config({
    baseUrl: "/js/",

    paths: {
        jquery: 'jquery',
        socketio: 'http://localhost:8000/socket.io/socket.io', //for loading the socket.io client library
        highcharts: 'libs/highcharts/highcharts.src',
        underscore: 'libs/underscore',
        backbone: 'libs/backbone'
    },

    shim: {
        jquery: {
            exports: 'jQuery'
        },

        socketio: {
            exports: 'io'
        },

        underscore: {
            exports: '_'
        },

        backbone: {
            deps: ['jquery', 'underscore'],
            exports: 'Backbone'
        },

        highcharts: {
            deps: ['jquery'],
            exports: 'Highcharts'
        }
    }
});

WiePabera bereits erwähnt, ist dies fürRequire.JS Ausführung2.0.1.

Ich hoffe, dass jemand etwas davon nutzt. Ich weiß, dass die Straße mich für eine Weile blockiert hat. Hoffentlich haben wir Sie daran gehindert, Ihren Kopf an die gleiche Stelle in der Wand wie wir zu stoßen, indem wir dies veröffentlicht haben.

Antworten auf die Frage(2)

Ihre Antwort auf die Frage