Hacker News Reader

Comment by lolinder | Hacker News Reader

Color management is easy in SCSS, too, though. I just have a _colors.scss file and enforce that no color is ever used that isn't in that file.

If I'm working with a designer rather than designing my own UIs, that they have a default color palette isn't helpful, so what do I gain from Tailwind?

EDIT: Reading some other comments, I wonder if part of the reason I don't see the utility is that I use Vue, not React. It sounds like Tailwind solves a lot of the same problems that Vue+SCSS does.

View on HN

One good part is the generated classes for every color. Background colors, font colors, border colors... everything in the color palette is usable as `bg-blue-500`, `text-blue-500`, `border-blue-500` etc. Could be reproduced in css for sure, but it's a great set of defaults that you can utilize cross-repo. Standardization is a powerful concept.

Including Tailwind’s list of colors in an scss codebase is trivial.

Same for spacing and font sizes if you need these standardized and haven’t done it already.

Which we always did way before tailwind was invented.

The killer for SASS nowadays is CI. You're either using the (ancient, slow) Ruby implementation of SASS, or node-sass which requires a native binary build and causes headaches across environments. Furthermore, with Post-CSS, the feature set of SASS has been completely subsumed by the latest CSS standard. There's really no good reason to use it anymore.

You should really be using the dart-sass[0] build (just `sass` on npm). None of the headaches of native binaries or using ruby, its pure JavaScript (its a dart codebase transpiled to JS). It is very fast.

[0]: https://sass-lang.com/documentation/#older-versions

>[0]: https://sass-lang.com/documentation/#older-versions

This is awesome, really glad to see things have progressed from the node-sass days. Might have to give it another look.

It's Sass, not SASS.

The native libsass is much faster. The headaches come from people trying to distribute binaries and libraries through NPM.

If we're being pedantic technically it's npm and not NPM ;)

Oof. I did not know this one.

> npm (originally short for Node Package Manager)

Acronyms can make sense to switch case, but initialisms... en-pee-em... I guess it happens. I originally was introduced it as Node Package Manager, but I'm gonna make an effort to correct this now.

For large apps yes; all Sass compile options are slow with embedded Sass being the least slow BUT:

Does your tooling even support embedded Sass?! Vite does not. Our version of webpack does not.. The Cenobites would LOVE Sass; never ending performance pain.

Reply on news.ycombinator.com