LESS in Eclipse automatisch kompilieren

Posted by in CSS, eclipse, Präprozessor

In letzter Zeit arbeite ich viel mit dem CSS-Präprozessor LESS. Da es für meine Lieblingsentwicklungsumgebung Eclipse anscheinend kein gutes Plugin gibt, habe ich mir einen Project-Builder zusammengebaut, der bei einer Änderung in LESS automatisch die neue CSS-Datei erstellt.

Setup

Unter der github-Seite des Projekts in der Sektion Getting started gibt es verschiedene Installationsmöglichkeiten. Je nach Einsatzgebiet wählt man dann das Passende aus.

Wichtig ist, sich den Installationsort zu merken (vor allem unter Windows). Unter Linux hilft einem das Konsolenkommando whereis lessc weiter (bei mir ist das /usr/bin/lessc). Dieser Pfad wird anschließend für den Project Buílder gebraucht, da dieser nichts anderes tut, als den Compiler aufzurufen.

Mein zu diesem Beispiel gehörendes Projekt heißt MyProject.

Project Builder anlegen

Project Builder werden für jedes Projekt einzeln erstellt. Hat man also in mehreren Projekten LESS-Dateien herumfliegen. Muss man die Prozedur wiederholen. Bei mir liegen sie normalerweise immer in einem Ordner. So behalte ich dann auch den Überblick.

Den Project Builder kann man unter

Rechtsklick auf das Projekt -> Properties -> Builders auswählen -> New

erstellen.

less-builder1
image-363

Wie man sieht braucht man jetzt den Pfad zum Compiler, den wir unter Setup ermittelt haben. Diesen trägt man unter Location ein. Anschließend wählt man das Projekt aus, für das der Builder sein soll. Als letztes müssen wir noch spezifizieren, mit welchen Argumenten der Compiler lessc aufgerufen wird. Meine LESS-Datei liegt unter src/de/myproject/less/default.less und die kompilierte CSS-Datei soll in src/de/myproject/css/default.css abgelegt werden. Der Aufruf entspricht der Konsoleneingabe, mit der man manuell den LESS-Compiler aufrufen kann

less-builder2
image-364

Zum vollständigen Glück richtet man sich noch einen Watchjob ein. Man will ja schließlich nicht jedesmal per Hand die Neukompilierung anstoßen. Eclipse soll das mal schön selbst erledigen, wenn eine Änderung vorliegt. Unter Specify Resources gibt man den Pfad zu den LESS-Dateien an, die überwacht werden sollen. Fertig!

Fazit

Die Verwendung von Project Buildern in Eclipse erscheint zuerst etwas verwirrend. Ich habe ein paar Anläufe gebraucht, bis mein Eclipse endlich den LESS-Compiler angeworfen hat. Wenn es dann soweit ist, wird man für seine Mühen entschädigt und kann sich über flinke Neukompilierung bei Änderungen in LESS-Dateien freuen.