nwjs reactjs,对我的上下文感到困惑。文档未定义

IT技术 node.js reactjs node-webkit nw.js
2021-05-02 11:25:24

在我的nwjs应用程序中,我使用React来构建我的 UI。目前,React是通过<script>主文件 index.html 中标签加载的index.html 有另一个<script>标签,它加载 main.js,其中包含定义和呈现我的React组件的代码,并且需要 ( require()) 一些 Node module,例如“fs”和“McFly”。

这一切似乎都在工作,但是当我尝试使用另一个节点module(react-inlinesvg)时,我收到一个错误,“文档未定义”。

在网上寻求帮助后,我得出的结论是React现在认为它正在服务器上运行?这很奇怪,在我开始使用 react-inlinesvg module之前,它很高兴使用React.render(客户端渲染)渲染组件

如果您需要更多上下文或信息,请询问。

2个回答

可能是您在服务器端渲染,或者您正在渲染双方。在第二种情况下,您可以简单地将导致错误的行嵌套为:

if (process.env.BROWSER) {
   the line causing the error
}

如果错误消失,则意味着您也在服务器端!我希望这有帮助...

基本上,如果您的代码是通用的(或同构的,如果您愿意...),则可以通过此检查仅在客户端执行代码,您希望这样做以使用特定的样式表,例如:

if (process.env.BROWSER) {
  require("../style/main.scss");
}

当然,如果你想做服务器端的事情,你可以检查

if (!process.env.BROWSER) {

}

如果有人遇到这个问题,他可以通过两种方式解决:

解决方案 1:如果您使用的是 nw.js 15 或更高版本,请尝试启用混合上下文模式:在您的 package.json 中添加此标志:

"chromium-args": "--mixed-context"

解决方案 2:使用此 hack 将文档公开给全局对象:

global.document = window.document;