×
COOKIES
Prezeraním tejto stránky dochádza k spracovaniu cookies. Spracovaniu cookies zabránite v nastaveniach internetového prehliadača alebo nezobrazovaním tejto stránky v internetovom prehliadači.
Technologický web Mateja Lednára
Spoznávajte svet technológií

Používame pre-processor Less vo vývojovom prostredí Eclipse

Pri práci s CSS sa skôr či neskôr uvažuje o spôsobe, akým zefektívniť vývoj webu aj po tejto stránke. Medzi populárne nástroje v rámci profesionálneho web developmentu určite patria Sass a Less. V tomto článku sa pozrieme na použitie pre-processora Less v populárnom vývojovom prostredí Eclipse, keďže jeho inštalácia a konfigurácia nemusí byť až tak jednoduchá, ako sa na prvý pohľad zdá.
Celú konfiguráciu a inštaláciu Less je možné zhrnúť do nasledujúcich piatich krokov.
1. Inštalácia Less
  • Stiahnutie pre-processora Less.js pre Windows (https://github.com/duncansmart/less.js-windows/releases)
  • Rozbalenie archívu a inštalácia napríklad do adresára C:\Less
2. Inštalácia Node.js
  • Stiahnutie Node.js pre Windows (http://nodejs.org/)
  • Inštalácia súboru
3. Inštalácia Xtext SDK
  • Spustiť Eclipse
  • Otvoriť Eclipse Marketplace
  • VyhľadanieXtext SDK (org.eclipse.xtext.sdk.feature.group - Eclipse Modeling Project)
  • Inštalácia zásuvného modulu
4. Inštalácia Less
  • Vyhľadanie LESS (net.vtst.ow.eclipse.less.feature.feature.group - Vincent Simonet)
  • Inštalácia zásuvného modulu
5. Vytvorenie konfigurácie pre Less
  • Run Configuration / LESS Compiler / pravé tlačidlo (right click) / new configuration
    • Nastavenie názvu (Name) - názov vytváranej konfigurácie
    • Nastavenie LESS command: C:\Less\less.cmd
    • Nastavenie Input File (vyhľadanie súboru *.less, ktorý sa bude kompilovať (transformovať na *.css)

Kompilácia Less v Eclipse

Pre spracovanie obsahu súboru *.less je potrebné spustiť kompiláciu. Tá bola nakonfigurovaná v poslednom bode. Stačí kliknúť na šípku vedľa ikony Run, zo zobrazeného menu vybrať Run As a potom LESS Compiler. Kompilátor následne vytvorí / prevedie súbor s príponou *.less na súbor s príponou *.css.

Záver

V prípade, že používateľ už má nainštalovaný Xtext, bod číslo 3 môže vynechať. Obdobne je možné postupovať aj pri Node.js.
CSS,Less,eclipse,configuration,xtext,pre-processor
Žiadna časť tohto článku nesmie byť reprodukovaná bez uvedenia autora a URL na túto stránku.
Viac informácií nájdete v sekcii O projekte.

Komentáre

Článok neobsahuje zatiaľ žiadne komentáre.

Pridať komentár

Meno (povinné)
Web
Správa (povinné)
Odoslať
Od najnovších