React app does not render when metamask is not installed

Question

I get this error in the console whenever metamask is not installed in the browser.:

Uncaught TypeError: window.ethereum is undefined

It's all just a black screen

Answer 1

The simple solution is to wrap anything that references window.ethereum with an if:

useEffect(() => {
  if(window.ethereum) {
    window.ethereum.on('chainChanged', () => {
      window.location.reload();
    })
    window.ethereum.on('accountsChanged', () => {
      window.location.reload();
    })

    // Your extra code here
  }
})