哪些CSS框架与React完美配合？

Question

我目前正在使用ReactJS。我正在寻找CSS框架，它将在优秀的网页设计中做出反应和帮助。

Answer 1

React在基于组件的样式或“JS in JS”解决方案中运行得特别好。它们解决了很多常见的CSS问题，比如样式冲突。

虽然目前没有明显的赢家。 CSS Modules和styled components与React完美配合，易于使用。

顺便说一句，你可以使用CSS模块完美地使用CSS文件（甚至是SASS），这样你就可以充分利用这两个世界。

查看CSS Modules github repo以获得详细介绍。您只需添加一个webpack加载器，然后在JS代码中导入样式文件。这是你可以检查的sample react app，它使用CSS模块+ SASS。

Answer 2

就个人而言，我不是 JS所有方法的粉丝。当然，React可能在设计时考虑了“JS in JS”，但可用于处理普通样式表的工具更加成熟（并且更好地记录）。因此，我将React和JSX与CSS pre（和post）处理器相结合，从而实现了两全其美。

它不像其他选项那样具有“革命性”，但SASS仍然是一个很棒的框架，它减轻了使用样式表的痛苦。

一个主要的好处是，由于导入，您可以自由地拆分和划分您的样式，但每个组件最终仍然会有一个专用的css文件。因此，您可以避免意大利面样式表的常见问题。