Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Proposta: eliminar Sass en favor de PostCSS #56

Open
afontcu opened this issue Nov 16, 2018 · 2 comments
Open

Proposta: eliminar Sass en favor de PostCSS #56

afontcu opened this issue Nov 16, 2018 · 2 comments

Comments

@afontcu
Copy link
Collaborator

afontcu commented Nov 16, 2018

(és una vella aspiració que tinc xD)

L'objectiu és alleugerir normandy i els projectes que el fan servir. Sass és una dependència molt pesada (et miro a tu, node-sass) i que causa problemes en desenvolupament i CIs. Us sona el npm rebuild node-sass?

El fotut del cas és que ara mateix donem a Sass (SCSS) principalment només dos usos:

  1. Nesting
  2. Variables

Ambdós casos queden resolts amb alternatives nadives (custom properties) i amb PostCSS.

PostCSS és un compilador de CSS (a la imatge de Babel amb JS). La diferència amb Sass és que és molt més lleuger, i ofereix una estructura basada en plugins.

Actualment, tenim 2 tipus d'implementació de Normandy:

  • En projectes amb Vue. En aquest cas, no cal fer-hi res: els projectes amb vue-cli suporten PostCSS de fàbrica.

  • En projectes "a pèl". En aquest cas, cal instal·lar i configurar un compilador de Sass. Caldria canviar aquest procés per un compilador de PostCSS. Es pot fer servir amb grunt, gulp, whatever.

Val a dir que les variables de Sass i les custom properties de CSS no són exactament equivalents. En tot cas, there's a plugin for that.

@kicaal
Copy link
Contributor

kicaal commented Nov 28, 2018

Con todos estos PROS por mi sería una muy buena opción :

  1. Puedes usarlo junto con herramientas de Automatización de tareas (gulp, grunt…) por lo que ademas de crear CSS, podemos hacer al mismo tiempo otras cosas desde la misma consola, como unir archivos js, minificar código, comprimir imagenes, etc…

  2. Es modular, solo usa lo que instalemos, y por el orden que lo hagamos haciéndolo más potente y rápido. !IMPORTANT

  3. Hay una gran colección de plugins con los que puedes hacer cosas que no puedes con los pre-procesadores actuales (más abajo dejo un ejemplo).

  4. Puedes crear tus propios plugins fácimente en javascript, si así lo necesitas.

  5. Puedes usarlo con archivos css “normales”, pero también usando el plugin que toque con archivos de otros pre-procesadores (sass, less, stylus…). Es decir, si te gusta escribir en SASS, puedes hacerlo igualmente, pero también puedes luego utilizar otros plugins con otras funciones.

  6. INFO DE MÁS --> Es usado por Google, Shopify, Twitter, Bootstrap, Codepen… por lo tanto, algo bueno tiene que tener.
    Usado con el plugin CSSNEXT puedes adelantarte unos años y empezar a escribir el código css del futuro (con variables, y demás características), pero te lo compilará al CSS actual con lso respectivos prefijos.

@oriolfg
Copy link
Contributor

oriolfg commented Mar 1, 2019

@kicaal te compro algunos pros que dices, però:

1 - No el compro, ja que SASS també ho automatitzes en un gulp, grunt etc, de fet abans del webpack ho feiem casi sempre així. no es una cosa bona només del PostCSS

6 - No el compro, el que fa la majoria no sempre és el millor... Sinó mira como vota la gente en las elecciones generales

Per la resta de punts ok, tampoc conèc PostCSS però entenc que casi be no hi ha corba d'aprenentatge i canviar-ho es relativament fàcil pel que dieu.

Si es pot compilar PostCSS de forma fàcil desde consola com un compass watch sense dependre de gulps ni res, llavors per mi endavant amb el canvi.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants