#page { background: url("https://www.coolcoyote.net/wp-content/themes/coolcoyote2/images/kubrickbgwide.jpg") repeat-y top; border: none; } */ ?>

Utiliser SASS et compass sous Windows

Pour tous les développeurs / intégrateurs travaillant sous Windows, voici la procédure d’installation de Sass et de Compass sous Windows 7 / 8.

Pour l’installation, je me suis basé sur les deux articles suivants :

Première étape, si Ruby n’est pas installé sur votre machine, foncez : http://rubyinstaller.org/downloads/

A l’heure où j’écris ces lignes, mieux vaut prendre la version 1.93 de Ruby et non pas la version 2.x.

Lors du processus d’installation, pensez à cocher la case permettant d’ajouter le répertoire de Ruby à la variable PATH

Installation de Sass

Ouvrir une console (Windows + R) et tapez « cmd ». Puis tapez la commande suivante :

gem install sass

Au bout de quelques secondes, le résultat (sensiblement différent selon les versions) devrait être :

Fetching: sass-3.1.20.gem (100%)
Successfully installed sass-3.1.20
1 gem installed
Installing ri documentation for sass-3.1.20...
Installing RDoc documentation for sass-3.1.20...

Utilisation de Sass

Pour l’utilisation, le principe consiste à lancer Sass en fond de tâche afin qu’il détecte toute modification de fichier .scss de notre projet et qu’il recompile le CSS automatiquement. C’est la méthode la plus simple.

Pour cela rendez-vous dans le répertoire de votre projet. Nous admettrons que vous avez un répertoire sass contenant tous vos fichiers Sass et que le fichier maître d’appelle style.scss, et un répertoire css dans lequel nous avons notre fichier de sortie style.css

Ouvre une console dans ce répertoire (MAJ + click droit dans le répertoire puis « Ouvrir une fenêtre de commande ici »).

Tapez ensuite la commande suivante :

sass --watch sass/style.scss:css/style.css

Le programme se lance, effectue une première compilation puis attend toute modification de fichier dans le répertoire sass.

Installation de Compass

A nouveau dans une console, tapez la commande suivante :

gem install compass

To be continued…

Mots-clefs : ,



Laisser une réponse

Vous devez être connecté pour publier un commentaire.