Blog post: Why We're Breaking Up with CSS-in-JS

[srmagura]

https://dev.to/srmagura/why-were-breaking-up-wiht-css-in-js-4g9b

Obviously, these are my personal opinions and not an official statement from the Emotion project. And absolutely no criticism intended towards other Emotion maintainers and contributors :)

[marlonschlosshauer]

Interesting blog post. Towards the end you mentioned the three benefits of CSS-in-JS again and explained that CSS modules give you both local-scopes and colocation. I'm curious how you guys now handle the third benefit: JS variables in styles.
I'm currently experimenting with css data-themes which I change via JS. What are you guys using now?

[srmagura]

We attach a lightTheme or darkTheme class name to the body element to switch between light and dark themes. In the CSS, these classes define values for lots of CSS variables, like --bg-primary and --text-primary.

Occasionally we will export values from the Sass module using the :exports syntax, so that the value can be accessed from JS, but this isn't necessary in most cases.

[marlonschlosshauer]

Ah interesting, thanks 👍