文章/答案/技术大牛

发布

社区首页 >问答首页 >Glide.js //未定义幻灯片

问Glide.js //未定义幻灯片
EN

Stack Overflow用户

提问于 2021-04-13 18:45:40

回答 1查看 251关注 0票数 0

所以我一直在尝试让glide.js参与我的项目。按照官方文档中的说明执行了所有步骤，但是一旦我在web控制台中使用new Glide(".glide").mount(); (就像文档中所说的那样)启动了滑动器，我就会得到

Uncaught ReferenceError: Glide is not defined

下面是相关的HTML：

<head>
<link
  rel="stylesheet"
  href="node_modules/@glidejs/glide/dist/css/glide.core.min.css"
/>
</head>
<body>
<!-- PROJECTS CARD  -->
<div class="card">
  <div class="card-header">Featured</div>
  <div class="card-body">
    <div class="glide">
      <div class="glide__track" data-glide-el="track">
        <ul class="glide__slides">
          <li class="glide__slide">0</li>
          <li class="glide__slide">1</li>
          <li class="glide__slide">2</li>
        </ul>
      </div>

      <div class="glide__bullets" data-glide-el="controls[nav]">
        <button class="glide__bullet" data-glide-dir="=0"></button>
        <button class="glide__bullet" data-glide-dir="=1"></button>
        <button class="glide__bullet" data-glide-dir="=2"></button>
      </div>
    </div>
  </div>
</div>
<!-- GLIDE SCRIPT  -->
<script src="node_modules/@glidejs/glide/dist/glide.min.js"></script>
</body>

这是我的JS：

new Glide(".glide").mount();

需要注意的是，我使用npm导入了glide。下面是package.json文件的相关部分：

"dependencies": {
"@glidejs/glide": "^3.4.1",
"@popperjs/core": "^2.9.2",
"bootstrap": "^5.0.0-beta3"

我知道我可能犯了一些愚蠢的错误，但我已经尝试了一个多小时，但没有任何成功。提前谢谢你！

javascript

glidejs

回答 1

Stack Overflow用户

发布于 2021-07-30 15:58:00

我看到脚本引用了glide.js，但没有看到初始化语句周围的脚本标记。

这将按照此处https://glidejs.com/docs/setup/ @ Initialization部分所述的方式工作。只需将它放在.js参考下面，就可以了。

<script>
  new Glide('.glide').mount()
</script>

票数 -1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/67073373

复制

相似问题

问Glide.js //未定义幻灯片
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Glide.js //未定义幻灯片EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Glide.js //未定义幻灯片
EN