I am trying to find the best way to use Swiper in bootstrap 4 based on a Laravel 5.7 website.
In installed Swiper with npm install swiper
.
In app.js I have:
require('./bootstrap');
require('swiper');
require('./custom');
bootstrap and custom are in resources/js just as app.js. Swiper is installed in /node_modules.
In custom.js
var ProjectSwiper = 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',
},
})
All above files are loaded and compiled correctly with npm run watch
, no errors here.
Still, the swiper is not working while the browser console says ReferenceError: Swiper is not defined
What am I missing here?
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire