0

Trying to use slick slider in my custom module

All css is loaded by /var/www/html/magento2/app/code/CompanyName/ReviewRating/view/frontend/layout/reviewrating_index_index.xml

I am In Developer Mode.

I followed Magento2 adding 3rd party jQuery files to module

1) In /var/www/html/magento2/app/code/CompanyName/ReviewRating/view/frontend/templates/reviewrating_index_index.phtml

<section class="vertical-center slider">
    <div>
         <div class="dummy-content"> I am a Text </div>
    </div>
    <div>
        <div class="dummy-content"> I am a Text </div>
    </div>
</section>

<script type="text/x-magento-init">
{
     ".vertical-center" : {
        "customjs" : {
            "autoplaySpeed": 5000
        }
     }
}
</script>

2) In /var/www/html/magento2/app/code/CompanyName/ReviewRating/view/frontend/requirejs-config.js

var config = {

     map: {
        '*': {
            customjs: 'CompanyName_ReviewRating/js/customjs',
        }
    },
    paths:{
        "slick": "js/slick/slick"
    },
    shim:{
        'slick':{
            'deps':['jquery']
        }
    }
};

console.log('This is printed');

3) In /var/www/html/magento2/app/code/CompanyName/ReviewRating/view/frontend/web/js/slick/ Below files are present in this location

 -> slick.js 
  ->slick.css
  ->slick-theme.css 

Issue: js file is not loaded

In console GET http://localhost/magento2/pub/static/frontend/Magento/luma/en_US/js/slick/slick.js net::ERR_ABORTED

1 Answer 1

0

It's hard to say without seeing all of your code in action but here are a few suggestions I can think of that might help:

Requirejs-config.js Formatting

In /var/www/html/magento2/app/code/CompanyName/ReviewRating/view/frontend/requirejs-config.js:

  • Remove the comma after the customjs: 'CompanyName_ReviewRating/js/customjs' line. Javscript (JSON) doesn't allow trailing commas on arrays the same way PHP does.

Clear Cache, Static Content, and Run Static Content Deploy

From your Magento root:

rm -rf var/cache/* var/view_preprocessed/* var/page_cache/*
rm -rf pub/static/*
php bin/magento setup:static-content:deploy

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.