站点根目录：Github Pages vs. `jekyll --server`

Question

当我运行 jekyll --server 时，我的站点在 http://localhost:4000/ 可用，但当我部署到 GitHub 项目页面时，它在 http://username.github.com/projectname/ 可用。

这意味着在引用样式表和其他资源时，我不能使用绝对 URL。当例如使用相同的布局时，相对 URL 会中断。 index.html 和 2012/01/01/happy-new-year.html。将样式表和其他资源添加到 GitHub 项目页面存储库的公认/好的方法是什么？

交叉发布到GitHub Issues。

Answer 1

出现此问题是因为根目录始终是用户 url (user.github.com)，在用户和项目页面中。我找到了解决办法：将_config.yml文件中的url变量配置到github项目页面：

safe: true
...
url: "http://user.github.io/project-name"

然后，在布局中，使用绝对引用，使用 site.url 变量来做到这一点：

<link rel="stylesheet" href="{{ site.url }}/css/styles.css">

并使用以下命令运行服务器：

$jekyll --server --url=http://localhost:4000

命令行选项在本地模式下覆盖配置文件中的设置。通过这些设置，我得到了指向正确位置的所有链接，它们都托管在 github 和本地模式中。

---

更新：Jekyll 1.0 由于 Jekyll 达到 1.0，上述选项 server 和 url 及其各自的命令行选项 --server 和 --url 已被弃用。新版本说明：

在_config.yml 文件中，添加变量baseurl（不带斜杠）：

baseurl: "http://user.github.io/project-name"

在布局或页面中，使用绝对引用，使用site.baseurl 变量：

<link rel="stylesheet" href="{{ site.baseurl }}/css/styles.css">

然后，运行本地服务器（baseurl 选项故意为空）：

$ jekyll serve --watch --baseurl=

有关docs 中的更改的更多详细信息。

Answer 2

由于命令行中的--url 已被弃用，因此还有另一种解决方案。

假设你的 URL 路径是 repo 在你 http://name.github.io/repo 中。现在在所有链接中都使用绝对 URL，例如

<link rel="stylesheet" href="/repo/css/syntax.css">

或链接

<a href="/repo/license/">License</a>

您现在只需在本地运行时将--baseurl 添加到命令行。

jekyll --server --baseurl /repo/

Answer 3

在最新版本的 jekyll (1.1.2) 中，我发现最好从原始版本中创建一个单独的配置文件。唯一的区别？ url（或 baseurl 变量）。

默认的 _config.yml 有：

url: myurl.com

新配置（我们称之为 _preview_config.yml）：

url: localhost:4000

这将根据您使用的配置重新分配所有绝对链接。现在使用预览配置运行服务器：

jekyll serve -w --config _preview_config.yml

完整的解释在我的blog。

Answer 4

简单回答您的问题：在_config.yml 中添加baseurl: '/project-name'

对于 CSS/JS 链接：{{ site.baseurl }}/css/styles.css

对于所有其他链接：{{ site.baseurl }}{{ post.url }}

Jeykll GH-Pages 官方答案在这里：http://jekyllrb.com/docs/github-pages/

摘录：

项目页面 URL 结构

有时在将 gh-pages 分支推送到 GitHub 之前预览一下 Jekyll 站点会很不错。但是，GitHub 用于项目页面的类似子目录的 URL 结构使 URL 的正确解析复杂化。这是一种利用 GitHub 项目页面 URL 结构 (username.github.io/project-name/) 的方法，同时保持在本地预览 Jekyll 站点的能力。

1. 在_config.yml 中，将baseurl 选项设置为/project-name——注意前导斜杠和尾随斜杠的缺失。例如：baseurl: '/my-proj'

2. 当引用 JS 或 CSS 文件时，这样做：{{ site.baseurl}}/path/to/css.css——注意紧跟在变量后面的斜线（就在“路径”之前）。

3. 在做永久链接或内部链接时，像这样：{{ site.baseurl }}{{ post.url }}——注意两个变量之间没有斜线。

4. 最后，如果您想在提交/部署之前使用 jekyll serve 预览您的网站，请务必将空字符串传递给 --baseurl 选项，以便您可以在 localhost:4000通常（开头没有/project-name）：例如：jekyll serve --baseurl ''

这样你就可以从 localhost 的站点根目录本地预览你的站点，但是当 GitHub 从 gh-pages 分支生成你的页面时，所有的 URL 都将以 /project-name 开头并正确解析。

Answer 5

我使用 jekyll-bootstrap 并在端口 4000 上本地部署，但我的 github 页面 url 是 user.github.com...我认为这取决于您最初创建 repo 的方式。最初我使用了 github 提供的自动页面构建器，它以非常类似于向导的方式创建了 repo。

我只是按照以下步骤操作：

http://jekyllbootstrap.com/

希望有帮助