Gatsby Build 由于 React 上下文和窗口引用而失败

Question

我有一个用 Gatsby 构建的站点，当我运行

gatsby build

时它失败了。发生错误是因为 SSR 包正在访问动态内容，例如 React 上下文和浏览器

document

和

window

对象。

例如，我的一个页面中有以下代码试图访问

generalState

，一个 React 上下文对象。在这种情况下，accessLevel 是管理站点上用户访问权限的上下文的一部分，如果访问级别不是 1:

，页面应该重定向到主页

if (generalState.accessLevel > 1) {
  navigate('/');
}

但我在尝试构建 SSR 包时遇到此错误：

WebpackError: TypeError: Cannot read properties of null (reading 'accessLevel')

尝试访问组件中的

window

或

document

时出现类似的错误。我已经阅读了一些建议将对浏览器的所有调用包装在支票中的一些答案。像这样的东西：

if (typeof window !== "undefined") {
  // do some stuff with window
}

我在代码中多次调用

window

，所以我不想这样做，但如果需要的话我可以。不过，上下文是更大的问题，因为我严重依赖应用程序中的反应上下文。它是否像在上下文引用的all 中使用可选链接一样简单？那会很乏味，但可能。我觉得有更好的解决方案。

任何想法将不胜感激。