Logo lms Le Mâle Saint Le côté obscur du mâle.

Organiser son CSS avec SASS : installation in da pocket !

Sass
Sachez que si vous êtes un néophytes en matière de SASS, cet article n’a pas pour but de présenter cet outil pratique pour l'intégration mais plutôt d’expliquer comment l’installer.

Le seul prérequis pour installer SASS est d’avoir Ruby d’installé sur sa machine ! Pour les Mac, Ruby est déjà installé, pour les windowsiens, voici un lien http://rubyinstaller.org/. Dès que c’est fait, il va falloir ouvrir le terminal/invite de commande !

Installer SASS est d’une simplicité, si aucune erreur vient pointez le bout de son nez, évidemment ! Il suffit de copier/coller la commande suivante :

 gem --install sass
Pour faire simple, cette commande va vous installer SASS sur votre ordinateur. Ne vous réjouissez pas trop vite, ce n’est pas terminé !

Maintenant, je vous laisse créer un fichier SASS. Attention, l’extension de ce fichier n’est pas «.sass» mais «.scss» ! Ne vous trompez pas sinon vous aurez des erreurs par la suite.

Toujours à l’aide du terminal, dirigez vous , depuis le terminal, dans le dossier où vous avez créé votre fichier SASS à l’aide de la commande suivante :

 cd /le_chemin_de_mon_dossier
Dès que vous serez dans le bon répertoire, vous devez exécuter la commande suivante :
 sass --watch fichier_sass.scss:fichier_css.css
Cette commande va «watcher»/regarder votre fichier «fichier_sass.scss» et le compiler dès que celui-ci sera modifié. La compilation permet de générer le fichier «fichier_css.css» voulu et c’est donc ce fichier «css» qu’il faudra inclure dans votre code HTML.

D’ailleurs, si vous faites maladroitement une erreur dans votre code, elle sera indiquée dans le terminal.

Tout s’est passé sans soucis ? Vous pouvez souffler et pousser un grand «ouf» de soulagement. Pour les autres, n’hésitez pas à poser vos questions.

Et pour finir, la documentation officielle de SASS est disponible sur son site web.

Pour suivre le Mâle saint plus facilement, retrouvez-nous sur Facebook :)
 


Vous avez aimé ? Partagez cet article:



Il n'y a pas encore de commentaire sur cet article, soyez le premier !

Découvrir d'autres articles

Le vendredi c'est Freebies #4

Quatrième distribution de freebies ! Comme d'habitude, Teddy se charge de partager ses meilleures trouvailles de l'Internet pour bien finir la semaine. Alors oui, messieurs (et mesdames) les webdesigners, intégrateurs et tous les gens qui font le web, vous allez être comblés. Le vendredi c'est Freebies, votre nouveau rendez-vous ultra-geek-o-phile.