DEV Community

John Doe
John Doe

Posted on

SwiperJs with Nuxtjs v2

Image description
Welcome everyone! Today I wanna talk about Sliders in Nuxt JS.

While making a website on NuxtJs I found it a bit complicated to make Swiper Js work with it.
Of course, there is a plugin called vue-awesome-swiper, but actually it is outdated and works good with Swiper v3-5 only.

But what if you want to use Swiper v6?

I found an easy and working the solution! It's actually was written on official website....
Ok -_-

Simply install swiper v6 with


 i swiper@6

``` or yarn, import it into the project and init it in `mounted` lifecycle hook as written [in official docs here](https://swiperjs.com/get-started). The manual is now for v7 but it actually works.

For those who still have some problems with it  you can find a full code on my [github page](https://github.com/seosmmbusiness/NuxtJs-SwiperJs)


Unfortunately, you cannot do that with Swiper v7, due to old webpack in Nuxt.
Hope Nuxt3 will become working for production and we will be ready to use Swiper with it.... 
soon.

Ps. The post image was found in Google Search by keyword `sliders`  hahaha
Enter fullscreen mode Exit fullscreen mode

Top comments (0)