docusaurus: Failed to deploy: Reference error self is not defined

I have a similar issue when importing the Redoc React Component (https://github.com/Redocly/redoc#usage-as-a-react-component). The error only occurs when I’m actually importing the component.

My workaround was

let RedocStandalone = () => <div></div>;
if (ExecutionEnvironment.canUseDOM) {
  RedocStandalone = require('redoc').RedocStandalone;
}

That said, is there any way to bypass or disable the SSR bundle? That may not be the right way to ask that question, but I just want a client bundle that I can deploy.

Thanks @lex111, I verified that that fixed the issue and deployed the site. PR is here https://github.com/facebook/hermes/pull/204

For D2, is there a way we can surface these errors with an explanation of how to fix? If I got an error that told me the issue was that I broke server side rendering I may have been able to fix this myself.

@mharsat It’s usually happen because of SSR related issues. You can bypass that by loading those only for client side.

I did something like that: https://github.com/dotansimha/graphql-code-generator/blob/master/website/src/components/live-demo/Editor.js#L1-L4

@yangshun <Suspense> and React.lazy fail to build

Docusaurus Node/SSR could not render static page with path=/api because of error: Minified React error #294; visit https://reactjs.org/docs/error-decoder.html?invariant=294 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.


Error: Minified React error #294; visit https://reactjs.org/docs/error-decoder.html?invariant=294 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

ReactDOMServer does not yet support Suspense

Solved my issue as well - re: Redoc barfing.

Thanks everybody!

@jonnynabors the workaround is along the lines of what I would recommend. Refer to https://github.com/facebook/hermes/pull/204/files for the recommended solution of using <Suspense> and React.lazy to lazily import the modules.

That said, is there any way to bypass or disable the SSR bundle

Nope. But we could consider adding that although we rather try to solve the problems that emerge along the way.

I’m having the same issue, but with navigator. The error is:

ReferenceError: navigator is not defined
(undefined) ReferenceError: navigator is not defined
    at main:12649:19
    at main:12643:28
    at Object.<anonymous> (main:12645:2)
    at __webpack_require__ (main:21:30)
    at Module.<anonymous> (main:105212:18)
    at __webpack_require__ (main:21:30)
    at main:169369:12707

start works fine, it only happens with build. I guess one of the deps in not compatible with SSR? but the error is not helpful 😦

Update: In my issue, it was CodeMirror, and I added a conditional loading:

import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment';

let CodeMirror = null;

if (ExecutionEnvironment.canUseDOM) {
  CodeMirror = require('codemirror');
}

If you are experiencing this issue with the latest v2, try to comment / replace with a dummy some of your components and see if it help, then try to find the cause for it.