为什么我们需要在安装样式组件之后安装gatsby-plugin-styled组件

Question

我正在学习Gatsbyjs，看到了一件奇怪的事情。

例如，如果要使用样式化组件，则需要安装：gatsby-plugin-styled-components AND styled-components

而我尝试仅安装样式化组件，并且可以正常工作。

我的问题是：

在这种情况下，为什么需要安装相关的Gatsbyjs插件？

Answer 1

答案是，仅使用styled-components将导致将styled-components其应用于客户端JavaScript运行时。因此，有时，当您加载Gatsby网站时，将styled-components不会立即在网站上看到使用-components 编写的样式，但是在一段时间后会应用它们，这会导致一些奇怪的视觉效果（元素在周围跳跃或变化）颜色/尺寸/其他属性）。

gatsby-plugin-styled-components 确保将样式直接从HTML传递给客户端。