I've looked everywhere for a simple answer to this and I can't find it. I'm used to importing swiper (v6) styles in my main.scss file like this:
@import "~swiper/src/swiper"
I gather something has changed in the way this has to work. But I can't get my head around it from the docs. Doing the following with Swiper (v8)
@import 'swiper/bundle'
Which results in:
Error: File to import not found or unreadable
And every other which way I can think of doing it doesn't work. Has anybody gone from 6 to 8 and care to shed some light?
I had the same issue and I found the solution in this answer.
You import the base Swiper styling like this:
@import "~swiper/swiper";
And then for every module you use (like navigation or pagination), you import the corresponding styling like this:
@import "~swiper/modules/navigation/navigation";
@import "~swiper/modules/pagination/pagination";
You can go to your node_modules/swiper/modules folder to see which modules are available.