React - 我应该用样式化的组件替换我的 css 文件吗答案

【问题标题】：React - Should I replace my css files with styled componentsReact - 我应该用样式化的组件替换我的 css 文件吗
【发布时间】：2021-04-17 06:41:04
【问题描述】：

我的问题可能有点奇怪，但我想了解一下，例如我的项目中有 10 个 css 文件，这些样式 90% 没有重复。在这种情况下是否值得使用样式化组件？即用一个对象替换所有这些样式？

const Button = styled.button`
  font-size: 2em;
  background-color: black;
  color: white;
`;

我知道样式化组件有很多优点。但我想了解是否值得用样式组件替换 10 个 css 文件的内容？因为也许将来我会需要这项技术

【问题讨论】：

欢迎来到 Stack Overflow！请拿起tour（你会得到一个徽章！），看看周围，通读help center，尤其是How do I ask a good question?、What types of questions should I avoid asking?和What topics can I ask about here?这是一个见仁见智的问题，所以这对 Stack Overflow 来说是题外话。

标签： javascript css reactjs styles styled-components

【解决方案1】：

不，我不这么认为。如果它们不可重复和可重用，并且你已经有很多 CSS 代码和文件，那么将它们转换为 Style-component 将需要很长时间，并且不会带来太多优势。除了 styled-components 的优点之外，还有一些缺点，因为它是一个纯 JS，如果它不可重用，它基本上会增加你的有效负载大小。所以在你的情况下，我认为你现在应该坚持使用 CSS。

【讨论】：

感谢您的回复，但让我再问一个关于这个主题的问题我在我的项目中应用了深色和浅色主题打开深色模式时我必须检查 value 如果它是黑暗的那么我必须将文本的颜色更改为白色问题是我在不同的文件中有很多文本，除了文本之外，我是否可以保持 css 不变，也就是说，仅对文本使用样式组件，因为有了它我摆脱了代码的重复
技术，是的，你可以。