jquery - Swiper分页不显示

Question

第一次使用swiper，我按照文档在我的代码中添加了html部分，然后在JS中初始化它，我初始化了分页，但它没有显示在我的页面上。这是我的代码:

JS:

var Swiper = require('swiper');
   $(document).ready(() => {
      var swiper = new Swiper('.swiper-container', {
        pagination: {
          el: '.swiper-pagination',
        }
      });
    });

HTML:

 <div class="swiper-container">
    <div class="swiper-wrapper">
      <div class="swiper-slide">Slide 1</div>
      <div class="swiper-slide">Slide 2</div>
      <div class="swiper-slide">Slide 3</div>
      <div class="swiper-slide">Slide 4</div>
    </div>
    <div class="swiper-pagination"></div>
   </div>

有人能解释一下我在做什么错吗？我得到了 px 中的分页元素高度和宽度？

Answer 1

帖子很旧，但仍然没有正确答案，所以:
您需要导入模块。

// core version + navigation, pagination modules:
import Swiper, { Navigation, Pagination } from 'swiper';

// configure Swiper to use modules
Swiper.use([Navigation, Pagination]);

// init Swiper:
const swiper = new Swiper(...);

文档: https://swiperjs.com/get-started/