Are you struggling to make Owl Carousel slider work because of ReferenceError: jQuery is not defined error in your magento 2 store?. If yes then you are on right place. Continue reading to find fix for this error.
Sometimes when you setup Owl Carousel throws jQuery is not Defined in your magento 2, it just doesn’t work as expected. Upon inspect element on error console you will see this error TypeError: $(…).owlCarousel is not a function or ReferenceError: jQuery is not defined. you check the code again and again this ReferenceError: jQuery is not defined doesn’t get away. This whole process of troubleshooting becomes so frustrating but but jQuery not defined shows you again and again, no matter what you try. Also takes huge amount of time.
Recently when working on a client’s site on magento 2, I did struggle a bit with this error, I finally fixed it with a tweak. Thinking that possibly other developers are also struggling for the same, I am posting here steps to fix this issue.
To fix this jQuery not defined in Owl Carousel just download your owl.carousel.min.js file from your matento site and open it in the editor.
Now add require([‘jquery’], function($) { ………..}); code in the file
So your code in the file should look like this
require([‘jquery’], function($) {
……owl.carousel.min file’s code goes here…..
});
Now replace this updated owl.carousel.min.js and run following commands in your terminal
php bin/magento setup:upgrade
php bin/magento cache:flush
Refresh your browser and voila, it should be working now.