React-static build error: ERR_REQUIRE_ESM or ReferenceError: window is not defined

Question

I have no idea how to solve this, but I tried many things that are probably just silly. I'd just like to finish changing my react-app to be a react-static-app, so I can finish my project. Everething works localy and I kind of know it has something to do with server vs client side JS, but I don't know where to start. Please help.

This is the error I get from regular yarn build:

[ERR_REQUIRE_ESM]: Must use import to load ES Module: 
  C:\my-projoect\node_modules\@babel\runtime\helpers\esm\objectWithoutPropertiesLoose.js
  require() of ES modules is not supported.
  require() of C:\my-projoect\node_modules\@babel\runtime\helpers\esm\objectWithoutPropertiesLoose.js 
    from C:\moji-projekt  i\rost-static\node_modules\react-spring\renderprops.js is an ES module file as 
    it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js 
    files in that package scope as ES modules.
  Instead rename objectWithoutPropertiesLoose.js to end in .cjs, change the requiring code to use 
    import(), or remove "type": "module" from 
      C:\my-projoect\node_modules\@babel\runtime\helpers\esm\package.json.

An this is what I get when I run yarn build --debug:

  ReferenceError: window is not defined

Withouth any indication where the problem is. I've placed if(typeof window === "undefined") return null; all around my project, but no luck.

Here's my package.json in case it could help to slove the issue:

{
  "name": "rost-react-static",
  "private": true,
  "scripts": {
    "start": "react-static start",
    "stage": "react-static build --staging",
    "build": "react-static build",
    "analyze": "react-static build --analyze",
    "serve": "serve dist -p 3000"
  },
  "dependencies": {
    "@reach/router": "^1.3.4",
    "@rooks/use-window-size": "^4.8.0",
    "@tinymce/tinymce-react": "^3.10.1",
    "@types/react": "^16.8.6",
    "axios": "^0.21.1",
    "bootstrap": "^4.5.3",
    "dotenv": "^8.2.0",
    "emailjs-com": "^2.6.4",
    "firebase": "^8.0.0",
    "particles-bg": "^2.5.0",
    "react": "^16.14.0",
    "react-bootstrap": "^1.4.0",
    "react-dom": "^16.14.0",
    "react-ga": "^3.3.0",
    "react-google-recaptcha": "^2.1.0",
    "react-google-recaptcha-v3": "^1.7.0",
    "react-helmet": "^6.1.0",
    "react-hot-loader": "^4.13.0",
    "react-html-parser": "^2.0.2",
    "react-icons": "^4.2.0",
    "react-particle-image": "^1.0.1",
    "react-phone-number-input": "^3.1.10",
    "react-player": "^2.7.0",
    "react-redux": "^7.2.2",
    "react-spring": "^8.0.27",
    "react-static": "^7.5.1",
    "react-static-plugin-reach-router": "^7.5.1",
    "react-static-plugin-sass": "^7.3.0",
    "react-static-plugin-sitemap": "^7.5.1",
    "react-static-plugin-source-filesystem": "^7.5.1",
    "recaptcha-v3": "^1.8.0",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0",
    "web-vitals": "^0.2.4"
  },
  "devDependencies": {
    "@types/react": "^16.8.6",
    "babel-eslint": "^10.1.0",
    "eslint": "^7.20.0",
    "eslint-config-react-app": "^6.0.0",
    "eslint-config-react-tools": "^1.1.7",
    "eslint-plugin-flowtype": "^5.2.2",
    "eslint-plugin-import": "^2.22.1",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-react": "^7.22.0",
    "eslint-plugin-react-hooks": "^4.2.0",
    "serve": "^11.3.2"
  }
}

Answer 1

I assume that you have missed some reference to window or there is some reference to window in some module you are using.

As per the react-static docs:

'Because React-Static code is both used in the browser during runtime and in node during build and export, it is very important that ALL your code be "universal" or in other words "node safe".'

https://github.com/react-static/react-static/blob/master/docs/concepts.md#writing-universal-node-safe-code

So checking for window with typeof, fixed this for me.

// works

const browserVar = typeof window !== 'undefined' && window.method ? 'browser' : 'node'

// does not work

const browserVar = window && window.method ? 'browser' : 'node'