web-dev-qa-db-ja.com

jekyllローカル開発中にsite.urlをlocalhostに変更します

私の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 }}を使用する方法はありますか？

hyperlinkjekyll
71
Heisenberg

これは、異なるJekyll環境間の一般的な問題です。

いくつかの説明

site.urlおよびsite.baseurlを理解する必要があり、どの状況でそれらが必要かを理解する必要があります。これらの変数は同じ目的を果たしません。

site.url

デフォルトでは、この変数はcanonicalヘッダーとRSS linkのページヘッドでのみ使用されます。このフィードを管理するソフトウェアはリソースのURLを認識しないため、サイトリソースを指すためにxmlフィードでも使用されます。

この変数は外部システムにのみ必要です。

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はこれらの環境のいずれかですぐに動作しない場合があります。

ここに2つの解決策があります：

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を使用します。

109
David Jacquel