【问题标题】:nwjs reactjs, confused about my context. Document is undefinednwjs reactjs,对我的上下文感到困惑。文档未定义
【发布时间】:2015-10-11 21:02:56
【问题描述】:

在我的 nwjs 应用程序中,我使用 React 来构建我的 UI。目前,React 正在通过主文件 index.html 中的 <script> 标记加载。 index.html 有另一个 <script> 标记,它加载包含定义和呈现我的 React 组件的代码的 main.js 以及需要 (require()) 一些 Node 模块,例如“fs”和“麦克弗利”。

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

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

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

【问题讨论】:

    标签: node.js reactjs node-webkit nw.js


    【解决方案1】:

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

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

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

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

    global.document = window.document;
    

    【讨论】:

      【解决方案2】:

      这可能是您在服务器端进行渲染,也可能是您在两侧都进行了渲染。在第二种情况下,您可以简单地嵌套导致您出错的行:

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

      如果错误消失,说明你也在服务器端! 我希望这会有所帮助...

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

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

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

      if (!process.env.BROWSER) {
      
      }
      

      【讨论】:

      • 嗨,很抱歉,只是澄清一下这会使“if”中的任何代码在浏览器上下文中运行?
      • 它检查浏览器上下文是否为真。所以我想是的,我会尽量让我的答案更清楚一点!
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2021-04-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-11-13
      相关资源
      最近更新 更多