将Bootstrap SASS添加到Jekyll/GitHub Pages

Question

将Bootstrap SASS添加到Jekyll/GitHub Pages

twitter-bootstrapsassbootstrap-4jekyllgithub-pages

3

我该如何将Bootstrap的SASS引入我的Jekyll项目中，以便在GitHub Pages上正常工作？

这不是这个问题的重复：将Bootstrap添加到Jekyll。那个问题与GitHub Pages关系不大，而且答案提到了使用Bower，我认为GitHub Pages不支持。

以下方法无效：

---
---
// This is at "/assets/css/site.scss"
@import "bootstrap";

我遇到了这个错误：

无法找到或读取要导入的文件：bootstrap

我尝试过使用 bundle add bootstrap，但没有改变任何东西。

我可以使用 npm install bootstrap 并让 Jekyll 从 node_modules/bootstrap 中获取所需的内容，根据此网站上的说明在我的机器上运行正常，但这不是 GitHub Pages 的合适解决方案，因为 GitHub Pages 不使用 npm。

- Matt Thomas

这个有更新吗？ - chia yongkang

@chiayongkang 对不起，我没有任何更新。除非GitHub Pages已经开始使用“npm”或类似的东西，否则也许唯一的解决方案就是将“node_modules”包含在源代码控制中，这样GitHub Pages才能看到它。如果问我的话，这不是一个很好的解决方案 :( 我已经转向其他项目了，所以自2018年以来我没有真正研究过这个问题。 - Matt Thomas

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- JasParkety · Accepted Answer

首先，您需要确保您的Bootstrap Sass文件没有在前面添加三条破折号，所以在bootstrap.scss中删除这些内容。

---
---

打开您的config.yml文件并添加以下行，我的建议是在根级别添加一个名为scss/的文件夹，并将所有scss文件放入其中（这里有点模糊，对我来说它是最好的，因为有各种帖子建议这样做，因为有时Jekyll :: Converters :: Scss？似乎会破坏相对路径）。

sass:
  sass_dir: scss

只需在其他一个 scss 文件中加入 @import "bootstrap.scss";，就可以使用了。在你想要编译成 .css 的其他文件中，确保包含这两行三个破折号，并将它们作为一个 .css 文件添加到你的 <head> 中。