Ändern Sie site.url während der lokalen Entwicklung von jekyll in localhost

Meine Jekyll-Blog-Vorlage enthält Links zu Ressourcen und Seiten wie folgt:

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

Dies funktioniert gut in der Bereitstellung, aber wenn ich jekyll servein der Entwicklung laufe , verweisen alle Links auf die Live-Seite anstelle der Entwicklungsseite.

my-site-url/my-page.html

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

Gibt es eine Möglichkeit, Jekyll {{ site.url }}in der Entwicklung anders zu verwenden?

Dies ist ein häufiges Problem zwischen verschiedenen Jekyll-Umgebungen.

Einige Erklärungen

Wir müssen verstehen site.urlund site.baseurlin welcher Situation wir sie brauchen. Diese Variablen dienen nicht demselben Zweck.

site.url

Standardmäßig wird diese Variable nur im Seitenkopf für den canonicalHeader und den verwendet RSS link. Es wird auch im XML-Feed verwendet, um auf Site-Ressourcen zu verweisen, da die Software, die diesen Feed verwaltet, die URLs der Ressource nicht kennt.

Diese Variable ist nur für externe Systeme erforderlich.

site.baseurl

Diese Variable gibt den Stammordner Ihrer Jekyll-Site an. Standardmäßig ist es auf ""(leere Zeichenfolge) eingestellt. Das bedeutet, dass Ihre Jekyll-Site die Wurzel von ist http://example.com.

Wenn Ihr Jekyll Website Leben in http://example.com/blogSie setzen müssen , site.baseurlum /blog( beachten Sie den Schrägstrich ). Dadurch können Assets (CSS, JS) korrekt geladen werden.

Sehen Sie, wie Assets in Ihren Kopf geladen werden:

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

das kann auch sein:

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

Arbeiten in verschiedenen Umgebungen

Jetzt müssen Sie Ihre Site lokal testen und in der Produktion bereitstellen. Manchmal ist das baseurlanders und das jekyll buildfunktioniert in einer dieser Umgebungen möglicherweise nicht sofort.

Hier haben wir zwei Lösungen:

Verwenden jekyll serve

Stellen wir uns vor, Ihre Site befindet sich in einem Github-Repository und wird dort bereitgestellt https://username.github.io/myProject.

Sie können Setup die baseurlzu /myProject. und testen Sie Ihre Site lokal mit jekyll serve, Ihre Site wird unter bereitgestellthttp://127.0.0.1:4000/myProject/

Verwenden Sie mehrere Konfigurationsdateien

Wenn Sie aus dem einen oder anderen Grund nicht verwenden können jekyll serve, können Sie eine Konfigurationsdatei für beide Umgebungen und jekyll buildje nach Bereitstellungsort festlegen .

Nehmen wir an, wir haben den lokalen Standort http://localhostund den Produktionsstandort https://username.github.io/myProject.

Wir verlassen das _config.ymlmit url: https://username.github.ioundbaseurl: /myProject

Wir erstellen eine neue _config_dev.ymlmit nur url: https://localhostundbaseurl: ""

Jetzt vor Ort testen:

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

oder

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

Wenn die Produktion jekyll buildaktiviert ist , verwendet der Befehl die Standardeinstellung _config.yml.