There are few options on how to include/import Swiper into your project:
import SCSS in the resources/scss/plugins.scss
file
npm install swiper
import Package and Css file
@import 'swiper/swiper-bundle.css';
We can install Swiper from NPM
import { Swiper, SwiperSlide } from 'swiper/react';
Below the example how to use the package and make it working swiper on any page.
Code
<Swiper spaceBetween="10" slidesPerView="1" autoplay="true" loop="true" modules="[Pagination, Autoplay]" pagination="{ clickable: true, el: '.swiper-pagination' }" className="productSlider" dir="ltr" > <div className="swiper-wrapper"> <SwiperSlide> ... </SwiperSlide> <SwiperSlide> ... </SwiperSlide> <SwiperSlide> ... </SwiperSlide> </div> <div className="swiper-pagination"></div> </Swiper> </div> </Swiper>
Be the first to know about new updates and exclusive discounts. No spam, just great offers!
How about
With over 7 years of experienced team, we specialize in delivering custom projects for startups, blue-chip companies, and government agencies. We have successfully completed over 250+ projects, providing tailored solutions that meet the unique needs of each client.
Hire Us© Domiex Created & Crafted by SRBThemes.