2

I ran into a problem opening the website I made using gatsby.js. The problem is only on browsers: ie, edge (I tested Firefox, chrome, ie, edge)

First, the browser shows the whole rendered page then it destroys the layout for some reason. The exception in the console is: 1-time: HTML1300, 2-times: ReferenceError: 'PerformanceObserver' is not defined, 1-time: SCRIPT5009: SCRIPT5009: 'PerformanceObserver' is not defined

Also any tips on how to update this project because it shows me some warnings in local production. I looked in the gatsby docs for a while but I cannot find anything. Sorry for the dumb questions but kinda a newbie at React, gatsby... Errors:

React-Hot-Loader: react--dom patch is not detected. React 16.6+ features may not work. in AppContainer (created by HotExportedIndexPage) in HotExportedIndexPage (created by PageRenderer) in PageRenderer (at json-store.js:93) in JSONStore (at root.js:51) in RouteHandler (at root.js:73) in EnsureResources (at root.js:61) in LocationHandler (at root.js:119) in LocationProvider (created by Context.Consumer) in Context.Consumer (created by Location) in Location (at root.js:118) in Root (at root.js:127) backend.js:6:2315

Warning: componentWillMount has been renamed, and is not recommended for use. See react-unsafe-component-lifecycles for details.

  • Move code with side effects to componentDidMount, and set initial state in the constructor.
  • Rename componentWillMount to UNSAFE_componentWillMount to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run npx react-codemod rename-unsafe-lifecycles in your project source folder. Preziranje nepodprtih entryTypes: paint. gatsby-browser.js:15

Please update the following components: SideEffect(NullComponent) backend.js:6:2315

Any insight or help into this mystery is very appreciated

Here is the link to my google drive folder where I pasted gatsby config files. If you need any other info about the page I will gladly provide the necessary information.

Alexs
  • 21
  • 1

1 Answers1

0

With refer to this article, we can see that the PerformanceObserver doesn't support IE and Edge browser.

React-Hot-Loader: react--dom patch is not detected.

About this issue, please check the webpack config, perhaps you need to use "@hot-loader/react-dom", instead of "react-dom". more detail information, please check this thread and this issue.

Besides, I suggest you check the package.json file and check the Gatsby Browser support.

Zhi Lv
  • 18,845
  • 1
  • 19
  • 30