Wie kann ein Drittanbieter eine jQuery-Bibliothek zu Magento 2 hinzufügen?
Während Magento 2 eine Version von jQuery in die Frontend-Designs einbezieht, ist das jQuery-Objekt im globalen Namespace nicht sofort verfügbar. Ich glaube, das liegt daran, dass Magento 2 RequireJS verwendet, um jQuery zu laden, und RequireJS eine Moduldatei erst lädt, wenn sie benötigt wird.
Dies ist ein Problem für jQuery-Plugins. Normalerweise würde ich ein Plugin mit HTML einbinden, das ungefähr so aussieht
<script type="text/javascript" src="http://magento-1-9-2-2.dev/js/commercebug/jquery-ui-1.8.custom/js/jquery.cookie.js"></script>
Dies ist jedoch mit Magento 2 nicht möglich. Da die jquery.cookie.js
Datei das jQuery-Plugin mithilfe des globalen jQuery-Objekts definiert, schlägt dies in Magento 2 mit einem jQuery is not defined
Fehler fehl .
Wie sollte ein Front-End-Entwickler eine Standard-JQuery-Plugin-Bibliothek in die Front-End-Anwendung von Magento 2 einbinden?
quelle
Antworten:
Erstellen Sie requirejs-config.js Companyname \ Modulename \ view \ frontend \ requirejs-config.js add
Ihre Js-Datei in Ihrem Modul Firmenname \ Modulname \ view \ frontend \ web \ js \ flexslider.js Fügen
Sie einfach jquery lib mit der folgenden Syntax hinzu
zweites Beispiel
quelle
Ich zitiere die Magento Docs .
Geben Sie in den folgenden Konfigurationsdateien ein Shim an, um eine Abhängigkeit vom Plugin eines Drittanbieters zu erstellen:
In Ihrer requirejs-config.js:
Fügen Sie dann Ihren Drittanbieter-Plugin-Code in Ihr Theme oder Modul ein: "web / js / 3-rd-party-plugin.js" wie folgt:
Diese Lösung ist günstig, da Sie Ihre Plugin-Datei ohne jegliche Modifikation einbinden. Ersetzen Sie einfach die js-Datei, wenn der Plugin-Autor aktualisiert oder sogar eine CDN verwendet!
quelle
Verwenden Sie am besten ein Magento 2- Modul oder ein Theme , um solche Plugins / Bibliotheken einzuschließen. Dies ist der empfohlene Weg und die beste Vorgehensweise .
Methode 1> THEMA : Wenn die JavaScript / JQuery- Bibliothek themenbezogen ist (um das Erscheinungsbild des Systems zu ändern).
[theme_dir] / web / js /
[theme_dir]
Methode 2> MODUL : Wenn die JavaScript / JQuery- Bibliothek mit einer bestimmten Geschäftsfunktion zusammenhängt oder eine Magento-Funktion verarbeitet. Es sollte sich in einem Modul befinden.
Platzieren Sie die Quelldatei der benutzerdefinierten Komponente an einem der folgenden Speicherorte:
[module_dir] / view / frontend / web / js /
Platzieren Sie Ihre requirejs-config.js- Datei in
[module_dir] / view / frontend /
quelle
Alan, jQuery UI Widget Factory hat einen Sonderfall. Um AMD kompatibel zu machen, überprüfen Sie bitte den folgenden Link.
http://gregfranko.com/blog/registering-the-jqueryui-widget-factory-as-an-amd-module/
quelle