Pagination Missing on Swiper 6

Pagination missing after updating swiper to version 6 https://codesandbox.io/s/pagination-example-dug1v

Fix from @kouliavtsev You can solve the pagination issue buy doing the following:

Step 1 Update swiper 5.4.5 to 6.1.2

Step 2 Update Slider.tx by adding the lines below.

import SwiperCore, { Pagination } from "swiper"
SwiperCore.use([Pagination])

all modules:

import SwiperCore, { Virtual,Keyboard,Mousewheel,Navigation,Pagination,Scrollbar,Parallax,Zoom,Lazy,Controller,A11y,History,HashNavigation,Autoplay,EffectFade,EffectCube,EffectFlip,EffectCoverflow,Thumbs} from "swiper"
SwiperCore.use([Virtual,Keyboard,Mousewheel,Navigation,Pagination,Scrollbar,Parallax,Zoom,Lazy,Controller,A11y,History,HashNavigation,Autoplay,EffectFade,EffectCube,EffectFlip,EffectCoverflow,Thumbs])

Here a complete list of modules you may use: https://swiperjs.com/api/#custom-build

Here is the list of additional modules imports: Virtual - Virtual Slides module Keyboard - Keyboard Control module Mousewheel - Mousewheel Control module Navigation - Navigation module Pagination - Pagination module Scrollbar - Scrollbar module Parallax - Parallax module Zoom - Zoom module Lazy - Lazy module Controller - Controller module A11y - Accessibility module History - History Navigation module HashNavigation - Hash Navigation module Autoplay - Autoplay module EffectFade - Fade Effect module EffectCube - Cube Effect module EffectFlip - Flip Effect module EffectCoverflow - Coverflow Effect module Thumbs - Thumbs module

[kouliavtsev]

You can solve the pagination issue buy doing the following:

Step 1 Update swiper 5.4.5 to 6.0.4

Step 2 Update Slider.tx by adding the lines below.

import SwiperCore, { Pagination } from "swiper"
SwiperCore.use([Pagination])

Here a complete list of modules you may use: https://swiperjs.com/api/#custom-build

[whyboris]

@jeffceriello I figured it out. In addition to the first line (as before), also include the second line:

import Swiper from 'react-id-swiper';
import SwiperCore, { Pagination } from 'swiper';

and later:

SwiperCore.use([Pagination])

Just as 🙇 @kouliavtsev wrote above 🎉

I got it to work with my Gatsby 👍 https://github.com/whyboris/Health-Impact-Fund/pull/31/commits/42fb91b7a30134a3363ea89e438bc1a4b3870b5d