Tavarn Ty Pwyll

Quel rapport me direz vous ? En fait Sass est le prédécesseur de Less, l’auteur de ce dernier explique d’ailleurs ici les raisons qui l’ont poussé à écrire ce nouvel outil.

Puisque je connais un peu less j’ai eu envie de goûter au grand frère.

A première vue rien de bien différent, si ce n’est l’indentation rendue obligatoire par la non présence des accolades dans le code sass, et quelques différences de langage : !ma_variable plutôt que @ma_variable.

à l’utilisation quelques différences apparaissent

les variables sass peuvent être modifiées

// test.sass
!primary_color = #eeeeee
!primary_color = #ffffff

#contents
  #sidebar
    color= !primary_color

!primary_color = red

.toto
  color = !primary_color

génère le resultat suivant

#contents #sidebar {
  color: white; }

.toto {
  color: red; }

Comme précisé dans la documentation en ligne less n’autorise pas ce genre d’opérations.
…

Note that variables are actually ‘constants’ in that they can only be defined once.

// test.less
@primary_color: #eeeeee;
@primary_color: #ffffff;

#contents {
  #sidebar {
    color: @primary_color;
	}
}

@primary_color: red;

.toto {
  color: @primary_color;
}

génère le resultat suivant

#contents #sidebar { color: #eeeeee; }
.toto { color: #eeeeee; }

au niveau des autres différences nous avons les directives de contrôle : if, for, while qui n’existe pas dans less, ainsi que la possibilité d’inclure dans les css générée des commentaires à partir du fichier sass ; ainsi que l’Interpolation: #{} permettant d’evaluer une variable lors du processus de transformation ( exemple extrait de la documentation )

!name = foo
!attr = border
p.#{!name}
  #{!attr}-color: blue

is compiled to:

p.foo {
  border-color: blue; }

par contre je n’ai pas trouvé dans sass comment récupérer la valeur d’une propriété d’une règle précédemment définie comme on peut le faire dans less

.article { color: #294366; }

.comment {
  color: .article['color'];
}

Conclusion

Les deux systèmes se valent, j’ai personnellement une préférence pour Less, en effet je préfère sa syntaxe et surtout j’aime bien l’idée des ‘variables constantes’, et des sélecteur de propriété.