0

Platform: Magento2

I want to import and use 3nd Jquery library in my module. Eg: https://www.jqueryscript.net/other/SEO-friendly-jQuery-Infinite-Scroll-Plugin-Clever-Infinite-Scroll.html use to create infinate scroll loading.

I try this:

var config = {
    paths: {
        'clever': 'Test_Example/js/lib/clever'
    },
    shim: {
        'clever': ['jquery']
    }
};

then use it in template:

<script>
    require([
        'jquery',
        'Test_Example/js/lib/clever'
    ], function($){
        console.log($('.product-items'));
        $('.product-items').cleverInfiteScroll({
            // for custom selectors
            contentsWrapperSelector: '.product-items',
            contentSelector: '.product-item-custom',
            nextSelector: '.next',

            // path to the loader GIF
            loadImage: 'Test_Example/images/loader.gif',

            // set the offset distance for fetching next page
            offset: 0,

        });
    });
</script>

but does not work.

I also try this tut: https://devdocs.magento.com/guides/v2.4/coding-standards/code-standard-jquery-widgets.html, but it is not helpful.

How can i do that?

2 Answers 2

0

Simple Change below code

require([
        'jquery',
        'Test_Example/js/lib/clever'
    ], function($){

to

require([
        'jquery',
        'clever'
    ], function($,clever){

Update


Added "clever"

function($){

to

function($,clever){

4
  • Hi @Gohil Rajesh, thank you for support, but it still does not work. I got error: Uncaught TypeError: $(...).cleverInfiteScroll is not a function
    – Nhat Lich
    Commented Feb 21, 2022 at 6:51
  • check updated answer Commented Feb 21, 2022 at 6:57
  • Hi @Gohil Rajesh, thank you for your support. Unfortunately, it did not work. I decided to use another library that is jqueryscript.net/other/…, and it works as expected. I dont know the reason, maybe due to wrong declaration.
    – Nhat Lich
    Commented Feb 24, 2022 at 8:37
  • Glad to here..finally you found alternative. Commented Feb 24, 2022 at 17:12
0

You haven't included an alias for Clever.

Change function($) to function($, cleverInfiteScroll)

1
  • Hi @Ben Crook, thank you for your support. Unfortunately, it did not work. I decided to use another library that is jqueryscript.net/other/…, and it works as expected. I dont know the reason, maybe due to wrong declaration.
    – Nhat Lich
    Commented Feb 24, 2022 at 8:37

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.