0

I'm having an issue with what I think should be a basic thing but I'm obviously doing something wrong, all I want to do is have a basic banner slider using slick slider jquery plugin. I have a custom theme working fine and I've downloaded the slick.min.js to app/design/frontend/Pyxis/pyxistheme/web/js/slick.min.js

I have then created the requirejs-config.js in my /web folder and added this:

    `var config = {
        paths: {
            slick:        'js/slick.min'
        },
        shim: {
            slick: {
                deps: ['jquery']
            }
        }
    };

`

which when I view the page source and view the file I can see that code.

My issue is that when I add the jquery code to a CMS page ie homepage like so:

<script>
    require([
        'jquery',
        'slick.min'
    ], function ($) {
        jQuery(document).ready(function () {
            jQuery(".home-banners").slick({
                dots: true,
                infinite: true,
                arrows: true,
                speed: 300,
                slidesToShow: 1,
                slidesToScroll: 1,
            });
        });
    });
</script>

I get a console error saying slick.min.js cannot be found? I have ran these commands in my terminal:

php bin/magento setup:upgrade
php -d memory_limit=2048M bin/magento setup:static-content:deploy en_GB -f
php -d memory_limit=2048M bin/magento cache:flush

Any idea why it can't find my slick.min.js file?

Thankyou

0

In your require script you need to use the path you defined in requirejs-config.js, in your case this is 'slick'.

Try updating that and then redeploying your static content (unless you're in developer mode and then you shouldn't need to).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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