01/10/2013 Development / css

Hoje eu comecei a dar uma olhada mais profunda em SASS.

Particularmente eu achei animal a ideia da parte de escrita e compilação. Poder colocar todos os arquivos num mesmo diretório e depois que salvar automaticamente já sair um css compressado, achei do caraleo.

Então, vamos lá:

  1. Instalar o Ruby - http://rubyinstaller.org/downloads/
  2. Depois rode no cmd - gem install sass
  3. Agora você já pode usar o sass.

O ideial é que você sempre crie uma pasta em seu projeto chamada sass e outra css.

Na pasta sass, você coloca todos seus arquivos scss.

Você pode compilar seu arquivo manualmente : sass input.scss output.css ou fazer uma escuta na pasta, e a qualquer alteração de qualquer arquivo, ele compila automaticamente: sass --watch sass:css 

Você ainda pode compactar o css e até mesmo fazer uma compressão do arquivo.

1) sass --watch sass:css --style compact --no-cache
2) sass --watch sass:css --style compressed --no-cache

Uma outra dica é deixar todos os arquivo .scss com o underline no nome

_grid.scss
_buttons.scss
_nav.scss

e um arquivo default.scss e nesse default, você usar os imports

@import "grid";
@import "buttons";
@import "nav";

Quando rodar, o arquivo default vai ser gerado com todos os css agrupados.

Espero que sirva!