Livereload

flattr this!

Danach habe ich so lange gesucht. Ich arbeite an einer CSS- oder HTML-Datei, speichere sie und der Browser lädt die Seite automatisch neu. Ich spare mir dadurch den Weg über den halben Monitor und einige Klicks.

Nun habe ich die Lösung gefunden: LiveReload. Dieses Tool besteht aus zwei Teilen: Einem Browser-Plugin und einem Server, der den Ordner überwacht und dem Browser die Dateiänderungen übermittelt.

Die Extension für Safari und Chrome kann man hier downloaden. Für den Server wird Ruby benötigt. Unter OSX 10.6 wird Ruby (zumindest mit Xcode) mitgeliefert und braucht nicht extra installiert werden. Die Installation von LiveReload im Terminal ist simpel:

sudo gem install livereload

Falls bei der Installation Fehler auftreten, wie “file not found ‘osx/foundation’”, muss man RubyCocoa installieren.

Danach wechselt man im Terminal in den Ordner mit den Dateien, die man gerade editiert und überwachen möchte. Mit dem Befehl “livereload” wird der Server gestartet. Dann macht man die Seite in dem Browser auf und aktiviert die LiveReload-Extension (in Safari mit Rechtsklick/Enable LiveReload).

Nun wird die Seite neu geladen, wenn man die Source-Dateien editiert und speichert.

Wenn Du bei der Installation Probleme hast, poste die Frage in den Kommentaren!

Update 1:

LiveReload überwacht einen bestimmten Satz an Dateiendungen, den man jedoch leicht erweitern kann. Dafür die Datei ~/.livereload (Datei ist im Userverzeichnis) anpassen.

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

*

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>