Joshua Comeau 深入探讨 了 styled-components 的工作原理，方法是重新构建基础知识。 一段有趣且有益的旅程。
styled-components 似乎是 React 中 CSS-in-JS 市场中最大的参与者。 尽管身处这个领域，但我还没有完全被它所吸引。 我非常喜欢基础知识：通过唯一类名实现作用域样式。 我也喜欢它与热模块重载一起工作，因为这一切都发生在 JavaScript 中。 但我通过 css-modules 获得了这些，并且我喜欢通过 css-modules 获得的文件分离和 Sass 支持。 不过，我开始逐渐接受一些事情了（一点点）
- 即使使用 css-modules，您仍然需要考虑名称。 即使它仅仅像
.root或其他什么。 使用 styled-components，您可以将样式直接附加到组件，而无需真正命名任何内容。 - 使用 css-modules，您将样式直接应用于 HTML 元素。 使用 styled-components，您可以将样式应用于自定义组件，它将通过稍后扩展 props 来应用样式。
- 由于样式实际上位于 JavaScript 文件中，因此您可以使用 JavaScript 功能——三元运算符、prop 访问、复杂的数学运算等。
Styled Components 太棒了！ 随着您深入了解，您会逐渐学习更多可以使用它的很棒的东西！ 它确实是我在 React 中最喜欢的样式类型！
仅传输当前视图中组件所需的 CSS 是另一个巨大的优势。
不确定命名认知负载在 styled components 中是否发生了很大变化。 仍然需要为每个组件命名。
大约十年前，我们不是花了一段时间教人们 HTML 标签的样式属性不好吗？