Ich benutze requirjs + jquery + jqueryui. Ich habe TONS von Beispielen gelesen, wie man das macht. Ich denke, ich verstehe die verschiedenen Ansätze und es scheint mir, dass mein Setup korrekt funktionieren sollte. Allerdings bekomme ich gelegentlich ein $. Widget ist nicht definiert Fehler in meinen benutzerdefinierten Modulen, die auf jquery-ui abhängen. Es ist ein Schmerz, weil es widersprüchlich und schwer zu reproduzieren ist, so dass es mir schwer fällt, alternative Ansätze zu testen.
Ich speichere nicht alle meine jquery-Plugins, weil es eine Menge gibt. Stattdessen lade ich Jquery mit einem separaten Requestjs-Aufruf. Dann lade ich im Callback den Rest meiner Sachen. Auf diese Weise muss ich keine Liste von Shims für alle meine jquery-Plugins verwalten.
Für jquery-ui verwende ich ein Shim, um es abhängig von jquery zu machen. Dann haben alle meine benutzerdefinierten Module, die die Widget-Factory verwenden, 'jquery-ui' in ihrer Abhängigkeitsliste.
In meinen Vorlagen ...
%Vor%Beachten Sie, dass ich site.js vor mypage.js lade. Sie haben einige gemeinsame Abhängigkeiten. In meiner Build-Konfiguration schließe ich site.js von mypage.js aus, daher werden die gemeinsamen Abhängigkeiten in site.js und nicht in mypage.js kompiliert. Daher muss ich site.js vor dem Laden von "mypage.js" vollständig laden, andernfalls muss ich versuchen, diese freigegebenen Abhängigkeiten separat zu laden.
Hier ist ein Beispiel für ein benutzerdefiniertes Modul, das von jquery-ui abhängt.
%Vor%Der Fehler $ .widget ist nicht definiert, wird durch die fünfte Zeile dieses und ähnlicher benutzerdefinierter Module von mir verursacht. Wiederum ist es wirklich inkonsequent und schwer zu reproduzieren. Meistens bekomme ich den Fehler NICHT, auch wenn ich meinen Cache lösche. Kann jemand daran denken, dass Zeile 5 möglicherweise ausgeführt wird, bevor jquery-ui vollständig geladen ist?
UPDATE 16. August 2013
Ich konnte das etwas nachverfolgen. Ich habe ein einfaches Modul erstellt, das auf jquery und jquery-ui basiert.
%Vor%Die Ausgabe ist wie folgt:
%Vor%Also hat das globale jQuery-Objekt ein Widget definiert, aber die Kopie, die mir von requirejs zur Verfügung gestellt wird, funktioniert nicht.
Diese Antworten werden ein bisschen alt. Ich hoffe, ein bisschen eine aktualisierte Antwort anbieten zu können. jQuery UI kommt jetzt mit integrierter AMD-Unterstützung. Sie können es einfach mit
bekommen %Vor%und dann in requirejs.config einfach jquery_ui zum Abschnitt paths {} hinzufügen. Es ist keine Unterlegscheibe mehr erforderlich.
Wenn Sie nur den kleinen Unterabschnitt von jquery-ui laden möchten, installieren Sie jquery-ui und verwenden Sie dann das Build-Tool, das requiresjs bereitstellt, um ein Paket zu erstellen. Andernfalls, wenn Sie nur versuchen, eine einzelne Datei zu importieren, wird jede der jquery-ui-Dateien versuchen, ihre Abhängigkeiten zu laden, und Sie erhalten Dinge wie "Widget nicht definiert" oder "Datei widget.js nicht finden" usw. Ich habe eine kurze Beschreibung hier: Ссылка
Ich hoffe, das hilft.
hatte ein ähnliches Problem, wenn der dritte Teil der ASP.NET-Steuerelemente die jQuery-Definition entführte.
$ telerik. $ = jQuery.noConflikt ();
Obwohl sich das Skript selbst bereinigt hat, hat das Ende des jQuery-Skripts mein RequireJS-Mapping
überschriebenif (typeof define === "Funktion" & amp; & amp; define.amd) { define ("jquery", [], function () {return jQuery;}); }
RequireJS würde das Laden von Skripten verzögern und der RadScriptManager würde weiterhin Skripte unter das Formular-Tag einfügen, so dass es seltsame Rassenprobleme gab.
Bei einigen Anfragen war $ von meiner Map und war global Andere Anfragen $ war $ Telerik. $ Und war nicht global und eine andere Version
Um mein Problem zu lösen, habe ich die von den Telerik-Steuerelementen verwendete jQuery-Version wiederhergestellt und sie in einem scrip-Tag fest codiert, um sicherzustellen, dass sie immer verfügbar war und Telerik dann das Laden von JQuery deaktiviert hat. Nicht AMD, aber funktioniert gut genug für mich.
Ändern Sie Ihre Shim wie folgt:
%Vor%Hier ist ein Beispiel von eine Reihe von Require.js-Konfigurationen für beliebte Bibliotheken.
Ich denke, ich habe eine Lösung für mein Problem. Obwohl dieses Problem schwer zu reproduzieren war, werde ich noch eine Weile warten, bis ich meine eigene Antwort als richtig "akzeptiere". Außerdem lädt meine Antwort jquery nicht mit requirjs. Ich sehe keinen Grund, warum mir das wichtig ist. Aber wenn jemand einen Weg sieht, dies zu erreichen, ohne jquery in ein separates Skript-Tag laden zu müssen, lassen Sie es mich wissen.
Da sich jQuery selbst als benanntes AMD-Modul definiert, kann ich es einfach zuerst mit einem Standard-Skript-Tag laden, bevor ich irgendwelche Anforderungen an mich stelle. Dann entferne ich auch meinen Pfadeintrag für jquery, da er zu diesem Zeitpunkt bereits unter dem Namen 'jquery' geladen ist. Auf diese Weise gibt requirejs die korrekte "Kopie" von jQuery an mich zurück und alles funktioniert. Ich muss auch jQuery.noConflict verwenden, weil ich Garmin Communicator verwende, der von Prototype abhängt. Also, hier ist mein aktualisierter Code, der irrelevante Teile auslässt.
%Vor%Und meine Module können immer noch wie gewohnt von jquery und jquery-ui abhängen:
%Vor%Wenn Sie eine Methode von jQuery-ui überschreiben möchten, verwenden Sie am besten die Methode requirejs init. Dadurch wird sichergestellt, dass in jedem Modul, das jQuery-ui enthält, derselbe modifizierte Code verwendet wird.
Verwenden Sie Ihre Shim wie folgt
%Vor%Ich habe einen ähnlichen, sehr seltenen Fehler bei der Verwendung der jQuery UI mit Require.js festgestellt, die ich mit der jqueryui-amd Konvertierungsscript, um "AMD-Wrapped Module für jQuery UI zur Verwendung in Loadern wie RequireJS" zu erstellen.
Installieren Sie mit npm.
%Vor%Konvertieren Sie die jQuery-UI-JavaScript-Dateien, die von jqueryui.com heruntergeladen wurden
%Vor% Fügen Sie dann den Pfad des neuen konvertierten jqueryui -Verzeichnisses zu Ihrer require.js-Konfigurationsdatei hinzu.
Schließlich in Ihrer JavaScript-Datei, in der Sie eine der jQuery UI-Komponenten verwenden.
%Vor%Ich hatte das gleiche Problem wie Sie, indem ich meine Widgets in RequireJS-Modulen definiere, und obwohl ich nicht 100% sicher bin, dass dies die beste Lösung ist, war es für mich ohne Verletzung der Integrität der Module:
%Vor%Wenn Sie jquery-ui in Ihrem Modul benötigen, wird jQuery automatisch benötigt und das $ -Objekt wird alles enthalten, was Sie brauchen.
Tags und Links requirejs jquery-ui amd jquery-ui-widget-factory