Gatsby/webpack-未定义WebPackError窗口-在哪里？

问题描述

运行Gatsby Build时，我收到以下错误。

我知道如何修复它(例如，检查窗口的类型定义)，但我找不到该窗口的用法？我怎么知道它在哪里？我怀疑是节点模块，因为我自己的代码中没有很多窗口引用

非常感谢

failed Building static HTML for pages - 10.845s

 ERROR #95312

"window" is not available during server side rendering.

See our docs page for more info on this error: https://gatsby.dev/debug-html





  WebpackError: ReferenceError: window is not defined

  - build-html.js:110 doBuildPages
    /[gatsby]/dist/commands/build-html.js:110:24

  - build-html.js:124 async buildHTML
    /[gatsby]/dist/commands/build-html.js:124:3

  - build.js:206 async build
    /[gatsby]/dist/commands/build.js:206:5

推荐答案

感谢所有其他答案

我尝试了@Raz Ronen的答案，但更改global对象导致了其他问题，如未定义的本地存储。

我尝试删除所有节点模块，但无济于事。

奇怪的是，在删除节点模块后，错误发生了变化，我可以看到这一行！错误的原因。它位于Gatsby自己的导航方法中。

我的应用程序中有私人路线，类似于解释的in the docs：

mport React from "react"
import { navigate } from "gatsby"
import { isLoggedIn } from "../services/auth"

const PrivateRoute = ({ component: Component, location, ...rest }) => {
  if (!isLoggedIn() && location.pathname !== `/app/login`) {
    navigate("/app/login")
    return null
  }

  return <Component {...rest} />
}

export default PrivateRoute

但是，我不得不将导航放在useEffect挂钩中，以便像这样解决问题：

const PrivateRoute = ({ component: Component, location, ...rest }) => {
  const user = useContext(AuthenticationContext)
  useEffect(() => {
    checkLoginStatus()
  }, [])

  const checkLoginStatus = () => {
    if (!user && location.pathname !== `/login`) {
      navigate("/login")
    }
  }

  return <Component {...rest} />
}

这篇关于Gatsby/webpack-未定义WebPackError窗口-在哪里？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！