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', {
...
...
...
})
}