时间戳

首页 > 解决方案 > 是否可以通过添加链接样式表在 nextjs 项目中使用 bootstrap 4？

javascript - 是否可以通过添加链接样式表在 nextjs 项目中使用 bootstrap 4？

问题描述

我有这个项目，我在标题中导入了这样的引导程序：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" />

一切都很好，直到我决定添加一个旋转木马。旋转木马正确显示，但它不旋转并且侧面的按钮不起作用。我还注意到我折叠的菜单也不起作用。

在我的研究中，我看到很多人建议使用 reactstrap 和其他一些第三方库，但我想知道是否可以继续使用链接样式表。

从我读到的问题是 jquery 和 bootstrap 以错误的顺序导入，这可能会导致这些元素中断。

标签： javascriptreactjsbootstrap-4next.js

解决方案

使用另一个网站作为参考解决了这个问题： https ://www.bootstrapcdn.com/

而不是使用

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" />

我用了

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

它终于奏效了。

推荐阅读