0

Now the magento site version is 2.4.3. It's using the owl carousel for banner image and product images. And the owl carousel works well. But sometimes it isn't working. I think it's because the owl carousel js loads before the jquery js loaded. It returns this error. Uncaught TypeError: Cannot read properties of undefined (reading 'fn') at owl.carousel.js:1713:4 at owl.carousel.js:1750:3

I imported the owl carousel js with require js.

var config = {
    paths: {
        'owlcarousel': 'Magento_Theme/js/owl.carousel'
    },
    shim: {
        'owlcarousel': ['jquery']
    }
};

require(['jquery'], function ($) {
    'use strict';

    $.noConflict();
});

Is there anyone can check this? And let me know the solution.

Thanks

1 Answer 1

0

Yes, Can you follow below setps.

Step 1:Please open owl.carousel.js file and add below code at the top of actual jquery(owl.carousel.js) script

define([
    'jquery'
], function () {

and now add the end bracket at the end of the jquery(owl.carousel.js) file.

its done for owl.carousel.js.

After changes run below commands.

php bin/magento s:up
php bin/magento s:s:d -f
php bin/magento c:c
php bin/magento c:f

If any query let me know.

THANKS.

3
  • Ok, let me check. But is it possible to add the define jquery to the additional js file?
    – Aaron Wang
    Aug 12, 2022 at 18:21
  • yes it is possible. Aug 12, 2022 at 18:22
  • It doesn't show any error in the console. But the slider isn't working.
    – Aaron Wang
    Aug 12, 2022 at 18:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.