$ npm i swiper
최신 버전의 swiper는
이라는 에러를 발생하면서 서버가 동작하지 않는다
검색결과
swiper 버전을 낮추라는 것
$ npm i swiper@^6.84
6.84버전으로 설치 후 component에 import도 새로 해주었다
// swiper bundle styles
import 'swiper/swiper-bundle.min.css'
// swiper core styles
import 'swiper/swiper.min.css'
// modules styles
import 'swiper/components/navigation/navigation.min.css'
import 'swiper/components/pagination/pagination.min.css'
다시 서버를 열어보니 에러없이 잘 동작
<swiper-slide>
<component>
</swiper-slide>
이런식으로 슬라이드에 컴포넌트를 넣어봤더니
display flex가 이상하게 적용 됨
swiper-slide와 관계없는 요소들까지
영향을 끼치면서 레이아웃이 틀어진다
다시 공부 필요..
내일은 Vue3-carousel 이라는 것으로
재설치 해서 해볼 예정