I am using Create React App and have imported the way the documentation says to do, since Create React App doesn't support pure ESM packages yet.
import { EffectCards } from "swiper";
import { Swiper, SwiperSlide } from "swiper/react/swiper-react.js";
But I get the error: Attempted import error: 'EffectCards' is not exported from 'swiper'.
EffectFade works fine, so why not EffectCards? Where else is it being exported from to be imported using Create React App?
The official documents stated that: "By default Swiper React uses core version of Swiper (without any additional components). If you want to use Navigation, Pagination and other components, you have to install them first."
To install them:
import SwiperCore, { EffectFade, EffectCards } from "swiper";
SwiperCore.use([EffectFade, EffectCards]);
In my case ("swiper": "^8.2.2") changing import statements helped
import { Swiper, SwiperSlide } from 'swiper/react/swiper-react.js';
import 'swiper/swiper.scss'; // core Swiper
import 'swiper/modules/effect-cards/effect-cards.scss';
import { EffectCards } from "swiper";