javascript - Glide幻灯片断点没有效果

Question

我使用Glidejs在同一页面中构建了几张幻灯片：

import Glide, { Controls, Autoplay, Keyboard } from '@glidejs/glide/dist/glide.modular.esm';

let slides = document.getElementsByClassName('g-related');

for (const c of slides) {
  let gid = '#' + c.id;
  let dur = Math.floor((Math.random() * 10000) + 1000);

  new Glide(gid, {
    type: 'carousel',
    autoplay: 10,
    animationDuration: dur,
    animationTimingFunc: 'linear',
    hoverpause: true,
    perView: 5,
    breakpoints: {
      1024: {
        perView: 4,
      },
      600: {
        perView: 3,
      },
    },
  }).mount({ Autoplay })
}

我使用docs 中所说的断点。所有幻灯片都可以工作，但断点不起作用。为什么？（hoverpause也不起作用）。

附加信息（上下文中的代码）

JS：

https://github.com/aitormendez/futurabasura/blob/main/web/app/themes/fb/resources/scripts/singleProduct.js#L47-L67

HTML：

https://github.com/aitormendez/futurabasura/blob/main/web/app/themes/fb/resources/views/woocommerce/single-product/related.blade.php#L62-L73

登台服务器中的工作示例（滚动到底部）：

http://fb.e451.net/shop/ill-et/

Answer 1

我忘记了从 ESM 模块导入断点：

import Glide, { Controls, Autoplay, Keyboard, Breakpoints } from '@glidejs/glide/dist/glide.modular.esm';

然后：

mount({ Autoplay, Breakpoints })