Пример подключение swiper на Webpack, который работал в версии 5, но перестал работать в Webpack 6.
Раньше работало такое подключение, которое подключала три блока:
import Swiper from 'swiper';
import {eachSwiperHome} from './common/swiper';
new Swiper('.js-swiper-1', eachSwiperHome);
new Swiper('.js-swiper-2', eachSwiperHome);
new Swiper('.js-swiper-3', eachSwiperHome);
import {eachSwiperHome} from './common/swiper';
new Swiper('.js-swiper-1', eachSwiperHome);
new Swiper('.js-swiper-2', eachSwiperHome);
new Swiper('.js-swiper-3', eachSwiperHome);
После обновления на 6-ю версию, та же схема работала только в одном экземпляре и только если поменять подключение swiper/bundle:
import Swiper from 'swiper/bundle';
import {eachSwiperHome} from './common/swiper';
new Swiper('.js-swiper-1', eachSwiperHome);
import {eachSwiperHome} from './common/swiper';
new Swiper('.js-swiper-1', eachSwiperHome);
Не стал разбираться, является ли эта проблемой настроек Webpack. Откатил до предыдущий версии, где все работало:
"swiper": "^5.4.5"