Pré-processadores e library de mixins, funções e afins

[abnersajr]

Hoje temos alguns pré-processadores na quebrada, sendo os mais conhecidos:

• LESS
• SASS
• STYLUS

Cada um com suas particularidades e cada pessoa tem sua preferência. Mas bah tchê! Que tal explicar a sua escolha, dizer por que não aquele outro e se usa alguma library qual(is)?

Eu utilizo SASS

Utilizo o SASS, usando a extensão SCSS, forma de escrita convencional, para manter a legibilidade do código.
Já usei o LESS e não gostei da forma que funciona os imports, coisa que gosto muito no SASS.
Nunca usei o stylus.
Trago acompanhado-o duas libraries:

• Media Queries: http://paranoida.github.io/sass-mediaqueries/
• Bourbon: http://bourbon.io/

[raphaklaus]

Já usei LESS e SASS. Gostei mais do SASS por que ele tinha mais funções na época.

Não costumo usar muito pré-processadores em projetos menores, acho um pouco over power.
Mas existem ferramentas incríveis, tipo esse Bourbon. Facilita muito a vida.

[fdaciuk]

Já usei os 3: comecei por LESS, mudei para SASS, pois tem muito mais features, logo faz mais sentido para uso como pré-processador, e então mudei pra Stylus por conta da velocidade de desenvolvimento e algumas features legais que ele tem. Escrevi alguns artigos sobre Stylus para mostrar algumas coisas que dá pra fazer.

Mas a grande vantagem dele para os outros é que foi escrito em JS, então é muito tranquilo de criar novas extensões pra ele. O tempo de compilação é muuuuito superior ao SASS (principalmente se comparado à projetos grandes).

Dei uma olhada no PostCSS, mas não me agradou muito não. Por enquanto continuo com o Stylus xD

[eduardojmatos]

Já usei Less, Sass e agora estou usando o Stylus aqui na empresa. Em projetos pessoais ainda continuo com Sass.

Ainda não posso opinar sobre o último, mas sempre usei o Sass com Scss também. Tirando alguns bugzinhos com media queries (tipo esse sass/sass#1050), nunca tive problemas.

Além disso, com o libsass em C, a performance de compilação subiu absurdamente!

Less usei só num projeto com Node, durante um curto período. Acabei não usando as funcionalidades mais hard-core dele.

[felipefialho]

Comecei com LESS, e gostava bastante. Me serviu muito bem durante muito tempo. Especialmente por ser um "CSS bombado" facilitou minha transição para pré-processadores. Com o passar dos anos, foram adicionando novas features e tentando se aproximar um pouco do Stylus e do SASS.

Porém o objetivo do LESS sempre foi se manter simples, e conforme a complexidade dos projetos e do código foi aumentando senti a necessidade de migrar para alguma ferramenta mais poderosa.

Já estava brincando com Stylus fazia um tempo, e por todos os meus projetos estarem em JavaScript (usamos Node e MongoDB na empresa), acredito que foi uma mudança natural.

[designernatan]

Já mexi com Sass e LESS.

Não gosto de algumas coisas da sintaxe do LESS, tipo os imports já mencionados ou inclusão dos mixins. Talvez seja pq mexi com Sass primeiro, mas prefiro ele. :)
Ah, e usando SCSS.

Pretendo brincar com Stylus em breve também.

[vitor-mendrone-deel]

Comecei com o SASS em um projeto Rails mas não muito tempo depois migrei para o Stylus.

Hoje eu uso ele em conjunto com o Jeet e com o Rupture.

Outras libs pra que recomento são Kouto Swiss e o Axis

A grande graça do Stylus (além da paridade de recursos de praticamente 1:1 com o SASS) é usar ele como um node module, o que agiliza demais a vida de quem usa o Node no dia a dia, sem contar que ele é mais rápido do que o Ruby SASS

[vitorbritto]

Sass

A maioria dos projetos que toco são com o Sass. Seja com sintaxe vide *.scss ou *.sass. As estruturas de laço, condição e interpolação de strings são as features que mais me atraem no Sass.

Quero portar para o libsass, mas só farei isso quando der uma pausa nos jobs. A compilação tem sido um parto (mesmo com o spawn: false). O que me deixa chateado no Sass é não poder aplicar o @extend em @media. =P

Stylus

Se o projeto é full-stack / Isomorphic JavaScript, nem penso duas vezes. Vou de Stylus até o fim. =]

LESS

Só utilizo quando é o preprocessador estabelecido por padrão no projeto.

[dionarodrigues]

Comecei com LESS, mas logo em seguida mudei para o Stylus.

Além do código ser mais clean, se tornando mais organizado, o Stylus me proporciona uma flexibilidade enorme com suas extensões, principalmente com o uso do jeet e do rupture.

[victorserpac]

Eu utilizo SASS e gosto bastante, nunca utilizei outro para poder comparar.

Estou para desenvolver um projeto em que é necessário disponibilizar um mini editor para o cliente poder escolher cor de determinados elementos e vi que o LESS possui a feature Modify Variables que possibilita mudar as variáveis compilando a partir do Browser.

Alguém sabe se existe algum método diferente/melhor para construir um editor desse tipo?

[Cleysonlb]

Hoje utilizo Stylus pois meu workflow gira em torno de JavaScript, mas optei por ele também por ser o que mais curti trabalhar, só uso outros caso ja esteja pré-estabelecido no projeto!

[willianjusten]

Eu comecei com Less há uns 3 anos e meio atrás, na época que o Bootstrap estava sendo lançado e ele era feito nessa Nova Onda. Me foi muito útil durante um bom tempo, mas eu fui querendo coisas mais específicas como loops e condicionais e com isso passei a usar o Sass na sintaxe scss.

Curioso que um tempo depois lançou o Bootstrap 3 contemplando o sass, usei um tempo ele, mas logo depois resolvi buscar novos ares, com grids mais semânticos e sem frameworks.

Foi aí que conheci o Stylus, que é uma paixão de muito tempo, junto a ele, eu comecei a conhecer coisas incríveis como Jeet, Rupture e etc.

E disso, eu criei um boilerplate que ainda uso em vários projetos, que é:

• Fast

Ps.: inclusive, quem quiser contribuir com o projeto, eu ando muito embolado de coisas, mas adoraria vê-lo crescendo e sendo utilizado. Conheço uma galera que passou a usar coisas que eu experimentei e mostrei a partir do Fast. Inclusive o @lfeh =p

[ribeiroevandro]

Eu nunca fui fã de LESS, cheguei a dar uma olhada nele e como já citado os importes dele me incomodou muito e outra coisa, declarar variável com @ é algo que não me agrada nem a pau...

Acabei indo para o Sass, até por isso o que motivou o projeto de tradução da documentação e logo cai na extensão .scss por não ser uma mudança drástica e recentemente tive um contato com o Stylus e o casamento foi perfeito, como já citaram algumas libs, vou citar outras que hoje fazem parte do meu workflow com ele...

• Jeet
• Repture
• Nib
• Combine Media Querie Esse apenas para auxiliar nas medias queries geradas e mantando organizado

Estou organizando aqui para subir o boilerplate que uso, embora tenha dado uma olhada superficial no Fast projeto do @willianjusten e gostei do vi...

[andersoonweb]

Tive meu primeiro contato com o sass!

Quando estava iniciando conheci o less, logo busquei feedbacks se aquilo agregaria no meu desempenho. Como não sabia css direito me recomendaram eu estudar mais e pratica. No fim desses estudos conheci o sass e estou usando até hoje. Não uso muito hardcore. Uso a sintaxe .scss, mas pretendo usar um pouco .sass. Já tá meio chatinho pra mim ficar abrindo chaves...

Como disse, não uso nada complementar.

Estou agora testando:

• Bourbon
• Juice

Pretendo testar o Stylus logo. Acho bem legal, até porque, uso Jeet e com Stylus fica bem mais simples. Além de ter o Repture que acho uma coisa linda.

PS: Se alguém conhecer alguma ferramenta similar ao repture para sass, partilha ai :)

[ribeiroevandro]

@andersonweb esse Juice parece ser bem interessante hein... Vou dar uma olhada nele depois com mais calma...

[andersoonweb]

@ribeiroevandro Eu gostei bastante. Além de não ler o código dele completo. Diga-me depois o que achou. 😄

[tcelestino]

Comecei com o LESS, depois migrei para o SASS e não deixei mais. Por sinal, alguém sabe como anda o desenvolvimento do LESS?

[dionarodrigues]

Hey @Mendrone encontrei sua palestra sobre o Stylus + Jeet e Rupture. Já tinha assistido ela. É interessante para os outros saberem como funciona essa super combinação.

[vitor-mendrone-deel]

Tem razão, @diogorodrigues valeu por postar 😁

Tem uma versão um pouco maior (somente os slides) que fiz no meetup CSS se quiser dar uma olhada ta aqui

[dionarodrigues]

Fantástico @Mendrone !! =D