Jekyll 博客文件夹不会在 github 页面上编译，但可以离线工作

Posted 2023-02-24

【中文标题】Jekyll 博客文件夹不会在 github 页面上编译，但可以离线工作

【英文标题】：Jekyll blog folder won't compile on github pages but works offline

【发布时间】：2015-11-01 18:44:40

【问题描述】：

我在myuser.github.io 建立了一个 github 用户页面存储库。我在那里建立了一个常规的 html 静态网站，效果很好。 （我还使用 CNAME 文件和 CNAME DNS 记录设置了一个自定义域，以便 myuser.github.io 转到 www.example.com）

然后我还在那个 repo 中创建了一个/blog 文件夹，并放入了一个 jekyll 博客模板。

在本地运行 jekyll build serve 或 bundle exec jekyll serve 不会给我任何错误。我可以发布新帖子，它们会出现在localhost:4000/blog/。

但是当我将博客文件夹推送到 github 时，会发生这些事情：

我收到一封来自 github 的电子邮件，内容是“b2/css/main.scss 文件包含语法错误。有关详细信息，请参阅 https://help.github.com/articles/page-build-failed-markdown-errors。” 如果我尝试访问 www.example.com/blog/index.html，我会收到 404。 如果我尝试在 /blog/ 且错误仍在 repo 中的情况下对我的 repo 进行任何新的更改（例如，更改我的 main 的标题， 非博客页面，或更改随机图像等）然后我推送，更改 根本不要在线注册（尽管它们显示在 github.com 的 repo 文件树）。

这意味着 github 因该错误而崩溃，并且在修复之前不会更新。

我怎样才能弄清楚那个“main.scss”错误是什么？因为在当地很好。 我是 jekyll（和 github 页面）的新手，但我尽可能地遵循了文档。

这是我的 main.scss：

---
layout: null
# Only the main Sass file needs front matter (the dashes are enough)
#http://sassmeister.com/
---
@charset "utf-8";


// Our variables
$base-font-family: "Raleway",Arial,sans-serif;
$base-font-size:   16px;
$small-font-size:  $base-font-size * 0.875;
$base-line-height: 1.5;

$spacing-unit:     30px;

$text-color:       #111;
$background-color: #fdfdfd;
$brand-color:      #2a7ae2;

$grey-color:       #828282;
$grey-color-light: lighten($grey-color, 40%);
$grey-color-dark:  darken($grey-color, 25%);
$blue-color:       #515865;

// Width of the content area
$content-width:    800px;

$on-palm:          600px;
$on-laptop:        800px;



// Using media queries with like this:
// @include media-query($on-palm) 
//     .wrapper 
//         padding-right: $spacing-unit / 2;
//         padding-left: $spacing-unit / 2;
//     
// 
@mixin media-query($device) 
    @media screen and (max-width: $device) 
        @content;
    




// Import partials from `sass_dir` (defaults to `_sass`)
@import
        "base",
        "layout",
        "syntax-highlighting"
;

PS：这是我使用的 jekyll 博客主题：https://github.com/smallmuou/Jekyll-Pithy

【问题讨论】：

只是为了确定：您在设置时是否关注this？

如果您更喜欢 php，可以使用基于 PHP 的应用程序 Scupling，它的功能几乎相同。在 Jekyll 出现一些问题后，我最近用它设置了我的博客。 [有一篇不错的文章])wouterj.nl/2015/02/using-travis-to-build-your-sculpin-blog).

是的，我确实遵循了 github 指南。 PHP 听起来不错，我也会去看看 Scupling。

【参考方案1】：

Github 页面是从根目录生成的。如果您将 Jekyll 放在 /blog 文件夹中，则不会发现您的 _setting.yml，并且可能会弄乱 scss 导入路径。

如果您想在本地复制，您必须重新创建相同的文件夹架构并从根目录而不是 /blog 触发 jekyll serve --trace。

解决方案是创建一个blog 存储库并将您的jekyll 推送到gh-pages 分支中。

【讨论】：

干杯，大卫。有道理，以为是自动检测到的。我用 gh-pages 分支创建了一个博客仓库，现在 www.example.com/blog/ 显示 jekyll 就好了。问题是，如果我去example.com/blog，它不会引导我去www.example.com/blog；它只是没有得到解决。 example.com 自动被定向到 www.example.com 并显示网站，但“子文件夹”似乎没有被重定向到 www.。我的 CNAME 用于 www.example.com 知道为什么它不起作用吗？我是否也需要在博客存储库中使用 CNAME？

没关系！我发现如果我的主站点有一个 CNAME 是 www.example.com，然后在我的博客 gh-pages 中有一个 CNAME 是 blog.example.com，那么如果我在我的网络浏览器中写 example.com/blog，它会重定向到 @ 987654336@ 并且有效。