In diesem Artikel erfährst du Schritt für Schritt, wie du einen Jekyll-Blog lokal unter WSL2 (Ubuntu) installieren, starten und testen kannst. Anschließend kannst du deinen Blog wie gewohnt auf GitHub Pages bereitstellen. Mit diesem Workflow kannst du die Änderungen lokal entwickeln und überprüfen, bevor du sie veröffentlichst.
1. Voraussetzungen
- Windows 10/11 mit aktiviertem WSL2
Stelle sicher, dass du das Windows-Subsystem für Linux (WSL2) installiert hast und eine Ubuntu-Distribution verwendest. - Visual Studio Code (VS Code) (empfohlen)
Ein Editor, mit dem du einfach in WSL2 arbeiten kannst. (Optional, du kannst jeden beliebigen Editor nutzen.)
2. Ruby und benötigte Pakete installieren
Jekyll benötigt Ruby sowie einige zusätzliche Pakete zum Kompilieren der nativen Erweiterungen. Öffne dein WSL2-Terminal (Ubuntu) und führe die folgenden Befehle aus:
Ruby und Build-Tools
sudo apt-get install ruby-full build-essential zlib1g-dev
Dieser Befehl installiert das volle Ruby-Paket, grundlegende Build-Tools und Bibliotheken zum Kompilieren von Ruby-Gems, die häufig nötig sind.
Weitere Abhängigkeiten (optional)
sudo apt-get install make gcc gpp zlib1g ruby-dev dh-autoreconf
Dieser Befehl sorgt dafür, dass du alle relevanten Tools und Header-Dateien hast. Manchmal benötigt Jekyll (bzw. die Gems, die du installierst) noch spezielle Pakete. Hiermit bist du auf der sicheren Seite.
3. Ruby Gems-Verzeichnis konfigurieren
Standardmäßig installiert Ubuntu Ruby-Gems nach /var/lib/gems/
. Meist ist es praktischer, Gems im Home-Verzeichnis zu halten. So hast du keine Probleme mit Schreibrechten und kannst den Pfad leicht steuern.
.bashrc
öffnen
code ~/.bashrc
Damit öffnest du die Bash-Konfigurationsdatei in VS Code. (Falls du einen anderen Editor verwendest, passe den Befehl entsprechend an, z. B. nano ~/.bashrc
)
Pfad in .bashrc
eintragen
# Install Ruby Gems to ~/gems
export GEM_HOME="$HOME/gems"
export PATH="$HOME/gems/bin:$PATH"
Füge diese Zeilen an geeigneter Stelle (z. B. ganz unten) in der Datei .bashrc
ein.
Erklärung:
export GEM_HOME="$HOME/gems"
legt fest, dass Gems im Ordner~/gems
installiert werden.export PATH="$HOME/gems/bin:$PATH"
sorgt dafür, dass ausführbare Dateien (bin
) aus diesem Ordner gefunden werden.
Änderungen aktivieren
exec bash
Dieser Befehl startet die Bash-Konsole neu, sodass die geänderten Umgebungsvariablen sofort übernommen werden (Alternativ: einfach das Terminal schließen und neu öffnen).
4. Repository-Verzeichnis ansteuern
In diesem Beispiel liegt dein Blog in einem Verzeichnis, das unter WSL2 auf das Windows-Dateisystem verweist. Das kann etwa so aussehen:
cd /mnt/c/repos/thimobuchheister.github.io/
/mnt/c/
zeigt an, dass du auf dein C-Laufwerk in Windows zugreifst.- Der weitere Pfad führt zum Ordner, in dem dein GitHub-Pages-Repository liegt.
5. Jekyll und Bundler installieren
Jekyll ist das Kern-Tool, mit dem du statische Seiten erzeugst. Bundler hilft dir, Ruby-Abhängigkeiten zu verwalten.
gem install jekyll bundler
Damit werden Jekyll und Bundler in deinen gerade festgelegten Gems-Ordner installiert. Achte darauf, dass du keine Fehlermeldung erhältst.
6. Abhängigkeiten installieren und aktualisieren
Wenn dein Blog ein Gemfile
besitzt (standardmäßig bei Jekyll-Projekten), kannst du die dort definierten Abhängigkeiten installieren:
bundle install
Dadurch lädt Ruby alle erforderlichen Gems herunter und konfiguriert sie für dein Projekt.
bundle update
Mit bundle update
aktualisierst du alle Gems auf die neueste, kompatible Version. Dies ist optional und sinnvoll, wenn du sicherstellen möchtest, dass dein Blog mit den aktuellen Versionen läuft.
7. Lokalen Jekyll-Server starten
Zum Testen deines Blogs rufst du einfach:
bundle exec jekyll serve force_polling --livereload --unpublished
- force_polling: Aktiviert Polling-Mechanismen zur Dateibeobachtung (nützlich in WSL2, da das Dateisystem anders arbeitet als native Linux-Systeme).
- livereload: Bewirkt, dass sich die Seite im Browser automatisch neu lädt, wenn du Dateien änderst.
- unpublished: Zeigt auch Beiträge an, die ein späteres Veröffentlichungsdatum haben oder als Entwürfe markiert sind.
Wenn alles erfolgreich gestartet ist, zeigt dir die Konsole eine URL an, üblicherweise http://127.0.0.1:4000/
oder http://localhost:4000/
. Öffne die Adresse im Browser, um deinen lokalen Jekyll-Blog zu betrachten und live zu testen.
8. Nächste Schritte
- Änderungen vornehmen: Bearbeite deine Markdown- oder HTML-Dateien im Projektverzeichnis.
- Automatisches Live-Reload: Sieh dir die Änderungen sofort im Browser an, ohne jedes Mal neu zu starten.
- Deployment auf GitHub Pages: Wenn du zufrieden bist, pushe dein Repository auf GitHub. Dort wird es – je nach Konfiguration – automatisch via GitHub Pages bereitgestellt.
Fazit
Mit diesem Setup kannst du lokal auf WSL2 problemlos an deinem Jekyll-Blog arbeiten, bevor du ihn über GitHub Pages veröffentlichst. Dank der Polling-Option und LiveReload-Funktion lassen sich Änderungen schnell überprüfen. Solltest du Fehler oder Probleme bemerken, prüfe:
- Ruby-Version und Berechtigungen in
~/.bashrc
- Abhängigkeiten in deinem
Gemfile
- Pfad zum Repository (insbesondere wenn du Windows-Pfade nutzt)
Viel Erfolg beim Erstellen und Pflegen deines Jekyll-Blogs!