在 jekyll 本地开发期间将 site.url 更改为 localhost [英] Change site.url to localhost during jekyll local development

问题描述

我的 jekyll 博客模板包含指向资源和页面的链接，如下所示:

My jekyll blog template have links to resources and pages like so:

{{ site.url }}/my-page.html

这在部署中效果很好，但是当我在开发中运行 jekyll serve 时，所有链接都指向实时页面而不是开发页面.

This works well in deployment, but when I run jekyll serve in development, all of the links point to the live page instead of the development page.

my-site-url/my-page.html

# But I want this in development
localhost:4000/my-page.html

有没有办法让jekyll在开发中使用不同的{{ site.url }}?

Is there a way to make jekyll use a different {{ site.url }} in development?

推荐答案

这是不同 Jekyll 环境之间的常见问题.

This is a common problem between different Jekyll environments.

我们需要了解 site.url 和 site.baseurl 以及我们在什么情况下需要它们.这些变量的用途不同.

We need to understand site.url and site.baseurl and in which situation we need them. Those variables don't serve the same purpose.

默认情况下，此变量仅用于canonical 标题和RSS 链接 的页面标题.它还用于 xml 提要中以指向站点资源，因为管理此提要的软件不知道资源的网址.

By default, this variable is only used in page head for the canonical header and the RSS link. It's also used in the xml feed to point to site resources as the software that will manage this feed doesn't know resource's urls.

只有外部系统需要这个变量.

This variable is only necessary for external systems.

此变量表示您的 Jekyll 站点的根文件夹.默认情况下，它设置为 ""(空字符串).这意味着您的 Jekyll 站点位于 http://example.com 的根目录.

This variable indicates the root folder of your Jekyll site. By default it is set to "" (empty string). That means that your Jekyll site is at the root of http://example.com.

如果您的 Jekyll 站点位于 http://example.com/blog，则必须将 site.baseurl 设置为 /blog(注意斜线).这将允许资产(css、js)正确加载.

If your Jekyll site lives in http://example.com/blog, you have to set site.baseurl to /blog (note the slash). This will allow assets (css, js) to load correctly.

看看资源是如何加载到你的脑海中的:

See how assets are loaded in you head :

<link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">

也可以是:

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

在不同的环境中工作

现在您必须在本地测试您的站点并将其部署到生产中.有时，baseurl 不同，jekyll build 可能无法在其中一种环境中开箱即用.

Working in different environments

Now you have to test your site locally and to deploy it in production. Sometimes, the baseurl is different and the jekyll build may not work out of the box in one of those environment.

这里我们有两个解决方案:

Here we have two solutions :

假设您的站点位于 github 存储库中，并在 https://username.github.io/myProject 中提供服务.

Let's imagine that your site lives in a github repository and is served at https://username.github.io/myProject.

您可以将 baseurl 设置为 /myProject.并使用 jekyll serve 在本地测试您的网站，您的网站将在 http://127.0.0.1:4000/myProject/

You can setup the baseurl to /myProject. and test your site locally with jekyll serve, your site will be served at http://127.0.0.1:4000/myProject/

如果由于某种原因，您无法使用 jekyll serve，您可以根据您的部署位置为环境和 jekyll build 设置一个配置文件.

If, for one reason or another, you cannot use jekyll serve, you can set a configuration file for both environment and jekyll build depending on where you are deploying.

假设我们在 http://localhost 上提供本地站点，在 https://username.github.io/myProject 上提供生产站点.

Let's say we have the local site served at http://localhost and the production site served at https://username.github.io/myProject.

我们将 _config.yml 保留为 url: https://username.github.io 和 baseurl:/myProject

We leave the _config.yml with url: https://username.github.io and baseurl: /myProject

我们创建一个新的 _config_dev.yml，只有 url: https://localhost 和 baseurl: ""

We create a new _config_dev.yml with only url: https://localhost and baseurl: ""

现在在本地测试:

jekyll build --config _config.yml,_config_dev.yml

或

jekyll build --config _config.yml,_config_dev.yml --watch

当推送到生产环境时，jekyll build 命令将使用默认的 _config.yml.

When pushed on production, the jekyll build command will use the default _config.yml.

这篇关于在 jekyll 本地开发期间将 site.url 更改为 localhost的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！