[larrymyers]

What causes me to constantly shudder is when I have to use project wide search to find the class name on an element so I can see what was caused the computed styles in the browser to occur.

  1. Find source file with class name. See the scss extension, dread rises a bit.
  2. See scss file has multiple @import directives and uses multiple custom functions.
  3. Open up 4 more scss files to see what those imports and functions do. See that those files also use @import directives. Find some Malort, take a shot.
  4. Repeat step 3 until arriving at root of style hierarchy or pass out.

That's why Tailwind works. It may result in a very long line of small classnames to represent all the styles across many breakpoints, but at least you don't have to deal with somebody else's own little hellish adventure into perfectly reusable scss.

[emmacharp]

But these are self-inflicted wounds. Having standards and validation for CSS is easy. No need for all of this. No need for SASS either. Install Stylelint and there you are.

[larrymyers]

I've encountered this situation in multiple projects where style lint was enabled, with only the defaults, and passed the linter without issue.

Tailwind is seeing steadily increasingly popularity (and the accompanying backlash) because it is straight forward and does not require something like stylelint to keep you from hurting yourself.

[aniforprez]

I don't know what magic stylelint does that I'm not aware of that helps with this. We used stylelint with a massive project and everything was nice and "clean" yet CSS debugging was a nightmare. At least with Tailwind I can look at the classes and tweak exactly what I want