nwjs reactjs, confused about my context. Document is undefined

好久不见. 提交于 2020-01-13 05:59:28

问题


In my nwjs application i am using React to build my UI. Currently, React is being loaded via a <script> tag in the main file, index.html. index.html has another <script> tag which loads main.js containing code which defines and renders my React components as well as requiring (require()) a few Node modules such as "fs" and "McFly".

This all seems to be working, however when i try using another node module (react-inlinesvg) i get an error, "document is undefined".

Having looked online for help, i have come to the conclusion that React now believes that it is being run on the server? Which is odd, as before i started using the react-inlinesvg module it was happily rendering components using React.render (clientside rendering).

If you need any more context or information then please ask.


回答1:


It could be that you are rendering on the server side, or also that you are rendering both sides. In the second case you could simple nest the line that is causing you error with:

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

If the error disappears, it means that you are on the server side also! I hope this helps...

Basically if you code is universal (or isomorphic, if you want...) with this check you can execute the code only on client side, you want to do this to use a particular style-sheet for example:

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

Naturally if you want to do stuff server-side you can check

if (!process.env.BROWSER) {

}



回答2:


if any one face this he can solve it in 2 ways:

Solution 1: if you are using nw.js 15 or above try to enable mix context mode: in your package.json add this flag:

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

Solution 2: expose document to the global object using this hack:

global.document = window.document;


来源:https://stackoverflow.com/questions/31555484/nwjs-reactjs-confused-about-my-context-document-is-undefined

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!