Sass et Sublime Text 3

Sass & Sublime text
Sass build, Sublime Text

Ruby

Sass , Syntactically Awesome Style Sheets, a besoin de Ruby pour fonctionner. Si l’on ne dispose pas encore de Ruby, installez-le. Ruby possède un installateur automatique pour Windows. Ne pas oublier de laisser cocher la case Add Ruby executables to your PATH.

Vérifier la version de Ruby

SASS

Avec l’installeur gem de Ruby, on installe SASS.

Sublime Text 3

Avec Package Control, on installe le package Sass. Ctrl+Shift+P et Package Control: Install Package.  Ce package installe la coloration syntaxique. Et le package SublimeOnSaveBuild, pour permettre de générer les css lorsque l’on sauvegarde les scss.

Et l’on crée un fichier de build dans le dossier User/. Ouvrir Preferences > Browse Packages et se rendre dans le dossier User. On crée un fichier SASStoCSS.sublime-build.

Losque l’on appuie sur Ctrl+B dans un fichier SASS, cela crée à la fois le CSS et le CSS compressé. En activant Tools -> Save All on Build, tous les fichiers SASS sont sauvegardés lors du processus.

Si l’on utilise Sublime SFTP et Sublime On Save Build, on peut à la fois compiler le fichier CSS et l’uploader sur un seveur. Pour cela, il faut ouvrir également le fichier CSS final, et en faisant Ctrl+Shift+P lorsque le fichier est ouvert, on sélectionne :

Sublime SFTP, upload on extarnal save
Sublime SFTP, upload on external save

On peut taper le raccourci Ctrl+Alt+U.

Et hop, on peut générer ses styles dans Sublime Text en utlisant SASS.

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables.