DEV Community

Discussion on: Why I moved from Styled Components to (S)CSS modules

Collapse
lynnntropy profile image
Lynn Romich

Not sure what you mean here, the thing with the class names getting garbled is something every styling solution (that supports scoped styles) does, because it's the only way to automatically avoid class name collisions without resorting to something like shadow DOM.

Unfortunately, the only way to avoid this is either to go back to unscoped CSS with something like BEM to avoid collisions, or to manually add stable identifiers to your components (for UI tests, supporting user styles, etc.), as either class names or data attributes.

Collapse
puruvj profile image
PuruVJ Author

I think he means it in relative terms. You can still make sense of CSS modules scoped styles, they're just same names with some junk appended here and there, where with styled components, there's no chance you could ever guess what this class stands for

Thread Thread
moopet profile image
Ben Sinclair

I mean it in "why not go back to regular CSS" terms.

Unfortunately, the only way to avoid this is [...]

... to do things the way they were designed to be done? I don't see this as so much of an unfortunate reality as I do a code smell.

Thread Thread
lynnntropy profile image
Lynn Romich

I mean it in "why not go back to regular CSS" terms.

Because "regular" (unscoped) CSS is incredibly cumbersome for large projects, and it gets even worse if you add more devs to the team. BEM and other CSS methodologies took us some of the way towards fixing this, but they're cumbersome in their own right, and only help so much. CSS-in-JS and CSS modules are the first solutions we've come up with that make CSS work well at the scales often we write it today.

... to do things the way they were designed to be done?

CSS (and most web technologies, for that matter) was never designed to be used for many of the things we use it for today. Using everything as it was originally designed isn't really compatible with modern webdev.

Thread Thread
puruvj profile image
PuruVJ Author

🙌🙌🙌🙌🙌