Je développe un module pour Magento2 et j'utilise requirejs pour charger du javascript personnalisé qui dépend de jquery. J'utilise l'option shim dans requirejs-config.js pour définir cette dépendance entre les scripts personnalisés et jquery. Le problème est que cette dépendance n'est pas (toujours) définie. Parfois, jQuery se charge avant le script et tout va bien, mais parfois il se charge après les scripts, ce qui entraîne une erreur de script:
Uncaught ReferenceError: jQuery is not defined(anonymous function) @ jquery.easing.1.3.js:39
Uncaught ReferenceError: jQuery is not defined(anonymous function) @ jquery.flexslider-min.js:5
Uncaught TypeError: $(...).flexslider is not a function
Voir ci-dessous un exemple de mon requirejs-config.js:
var config = {
map: {
'*': {
'flexslider': 'Vendor_Modulejs/jquery.flexslider-min',
'picturefill': 'Vendor_Modulejs/picturefill.min',
'easing': 'Vendor_Modulejs/jquery.easing.1.3',
'hoverintent': 'Vendor_Modulejs/jquery.hoverIntent',
'fitvids': 'Vendor_Modulejs/jquery.fitvids',
'vimeo': 'Vendor_Modulejs/jquery.vimeo.api.min'
}
},
shim: {
'flexslider': ['jquery'],
'picturefill': ['jquery'],
'easing': ['jquery'],
'hoverintent': ['jquery'],
'fitvids': ['jquery'],
'vimeo': ['jquery']
}
};
Voici le javascript dans mon fichier phtml:
require(['jquery', 'domReady!', 'picturefill', 'flexslider', 'easing', 'hoverintent', 'fitvids', 'vimeo'], function($) {
"use strict";
// javascript here
});
Que fais-je de mal ici, pourquoi l'option shim n'est-elle pas honorée et jQuery n'est pas toujours chargé avant les autres scripts.