Compiler des fichiers LESS dans Sublime Text 2

by Cédric Aellen /

Avant toute chose, cet article s'adresse aux personnes travaillant avec Sublime Text 2 sous Windows XP. Plutôt que d'utiliser un programme de compilation comme WinLess afin de compiler les fichier LESS en CSS. Voici une technique afin de le faire directement dans Sublime Text 2. Cela vous fera certainement gagner du temps pendant le dévelopement.
  1. Dans Sublime Text 2, installer le plugin less2css via Package Control/.
  2. Cloner le dépôt less.js-windows. Pour ma part, je l'ai cloner sous c:\workspace\less.js-windows.
  3. Ajouter dans votre PATH le lien vers le dépôt.
    1. Cliquer sur le menu Démarrer.
    2. Cliquer droit sur le Poste de travail.
    3. Aller dans l'onglet Avancé.
    4. Cliquer sur Variables d'environnement.
    5. Dans la liste des Variables système, séléctionner Path.
    6. Modifier la variable.
    7. Aller à la fin de la valeur de la variable ajouter un ; et entrer le chemin du dépôt less.js-windows que vous avez cloner précédement.
  4. Redémarrer Sublime Text 2.
A chaque fois que vous souvrez un fichier avec l'extension .less, celui-ci sera compilé en fichier .css. Cette technique est très pratique pour le dévellopement. Cependant, pour des environnements de production, je conseil de passer par des outils comme Code Kit qui lui permet de compiler les .css sur une seule ligne. Pour l'instant la technique ci-dessus crée des fichiers de ce type : 
#header {
  color: red;
}
#header a {
  font-weight: bold;
  text-decoration: none;
}
#header a:hover {
  color: #000;
  text-decoration: underline;
}
/* Operations */
#header {
  color: #333333;
  border-left: 1px;
  border-right: 2px;
}