Gatsby Styled Components 插件：未定义窗口
Posted
技术标签:
【中文标题】Gatsby Styled Components 插件：未定义窗口【英文标题】：Gatsby Styled Components plugin: window is not defined 【发布时间】：2021-06-27 04:00:38 【问题描述】：我的 Gatsby with Sanity 应用程序在运行 npm run build 时收到以下错误：
WebpackError: ReferenceError: window is not defined (from plugin: gatsby-plugi
n-styled-components)
似乎是外部包gatsby-plugin-styled-components 在某处使用window。我尝试用此处描述的虚拟模块替换https://www.gatsbyjs.com/docs/debugging-html-builds/#fixing-third-party-modules，但我的样式组件不起作用，所以它不是解决方案.
也许我在不支持的地方使用了样式化组件技术？我查看了不同的 gatsby/styled components 示例 repo，但找不到区别。
你可以在这里找到回购：https://github.com/sanderdebr/sanity-gatsby-portfolio
【问题讨论】：
【参考方案1】：这是因为您的项目或 gatsby-plugin-styled-components 在某处使用 styled-components@5.2.2，这是使用 window 的损坏版本。
该问题已在 SC Github 上跟踪：https://github.com/styled-components/styled-components/issues/3444
我建议你更新到 styled-components@5.2.3
【讨论】：
以上是关于Gatsby Styled Components 插件：未定义窗口的主要内容，如果未能解决你的问题，请参考以下文章
标题组件根据 React / Gatsby / Styled-components 中的背景更改文本颜色
Gatsby Styled Components , CSS 显示在 <head>
使用 styled-components 在组件/元素之间共享样式