Skip to content
  • 2 Votes
    1 Posts
    401 Views
    dogsD

    Whats the right way to use third party libraries?

    I tried to do it descriped in the docs:
    https://docs.nodebb.org/development/plugins/libraries/

    But it doenst work.

    I want to use Swiper in my Theme:
    https://swiperjs.com/get-started/

    I tried it with

    "modules": { "swiper.js": "node_modules/swiper/swiper-bundle.min.js" }

    in client.js i used:

    require(['swiper'], function (Swiper) { var mySwiper = new Swiper('.swiper-container', { // Optional parameters direction: 'vertical', loop: true, // If we need pagination pagination: { el: '.swiper-pagination', }, // Navigation arrows navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, // And if we need scrollbar scrollbar: { el: '.swiper-scrollbar', }, }) });

    The Javascript from Swiper does not load.

    Can you help me?

    I also treid to import it directly via html

    <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css"> <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>

    and I also copied the contents of:
    https://unpkg.com/[email protected]/swiper-bundle.js

    and createt a file unter /lib/swiper-bundle.min.js. Nothing worked for me. The JS is still not loading...

    Looking forward to your answers! 🙂

    I fixed it.

    I am sorry. In my development I use grunt. But it seems that I doesnt load new libraries if installen. So I determinated the process Ctrl+C and restarted it using grunt. The librariers are loaded and the third party library works well now using:

    "modules": { "swiper.js": "node_modules/swiper/swiper-bundle.min.js" } require(['swiper'], function (Swiper) { var mySwiper = new Swiper('.swiper-container', { ... ... ... }) }
  • 0 Votes
    5 Posts
    3k Views
    R

    @pitaj
    Boy, that was quick! Thanks 🙂

  • 0 Votes
    6 Posts
    4k Views
    N

    @psychobunny nice, It's very helpful.