我的jekyll博客模板包含资源和页面的链接,如下所示:
{{ site.url }}/my-page.html
这在部署中效果很好,但是当我在开发中运行jekyll serve
时,所有链接都指向实时页面而不是开发页面。
my-site-url/my-page.html
# But I want this in development
localhost:4000/my-page.html
有没有办法让jekyll在开发中使用不同的{{ site.url }}
?
答案 0 :(得分:106)
这是不同Jekyll环境之间的常见问题。
我们需要了解site.url
和site.baseurl
以及我们需要它们的情况。
这些变量不能用于同一目的。
site.url
默认情况下,此变量仅用于canonical
标头和RSS link
的页眉。它也在xml提要中用于指向站点资源,因为管理此提要的软件不知道资源的URL。
此变量仅对外部系统有用。
site.baseurl
此变量指示您的Jekyll站点的根文件夹。默认情况下,它设置为""
(空字符串)。这意味着您的Jekyll网站位于http://example.com
。
如果您的Jekyll网站位于http://example.com/blog
,则必须将site.baseurl
设置为/blog
(请注意斜杠)。这将允许资产(css,js)正确加载。
了解如何加载资产:
<link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">
也可以是:
<link rel="stylesheet" href="{{ site.baseurl }}/css/main.css">
现在,您必须在本地测试您的网站并将其部署到生产环境中。有时,baseurl
不同,jekyll build
可能无法在其中一个环境中开箱即用。
我们有两个解决方案:
jekyll serve
让我们假设您的网站位于github存储库中,并在https://username.github.io/myProject
处提供。
您可以将baseurl
设置为/myProject
。并使用jekyll serve
在本地测试您的网站,您的网站将在http://127.0.0.1:4000/myProject/
如果出于某种原因,您无法使用jekyll serve
,则可以为环境和jekyll build
设置配置文件,具体取决于您部署的位置。
假设我们在http://localhost
投放了本地网站,并在https://username.github.io/myProject
投放了生产网站。
我们将_config.yml
与url: https://username.github.io
和baseurl: /myProject
我们仅使用_config_dev.yml
和url: https://localhost
baseurl: ""
现在在本地测试:
jekyll build --config _config.yml,_config_dev.yml
或
jekyll build --config _config.yml,_config_dev.yml --watch
按生产时,jekyll build
命令将使用默认的_config.yml
。