reactjsreact-nativereact-devtoolsreact-native-debugger

React Native Debugger uses wrong version of react-devtools

Trying to debug apps with React Native Debugger. Shows "Unsupported DevTools backend version".

enter image description here

How I got here

I created a new app using expo init (expo-cli@5.2.0) with TypeScript blank template. Started app with expo ios, opened 'Debug Remote JS'

I have tried:

  1. yarn global add react-devtools@^4.22.0
  2. Change package.json to include:
"dependencies": {
    "expo": "~44.0.0",
    "expo-status-bar": "~1.2.0",
    "react": "17.0.1",
    "react-devtools": "^4.22.0",
    "react-devtools-core": "^4.22.0",
    "react-dom": "17.0.1",
    "react-native": "0.64.3",
    "react-native-web": "0.17.1"
},
"resolutions": {
    "react-devtools-core": "4.22.0"
  }

Deleted yarn.lock and /node_modules, then ran `yarn install`
  1. Reinstall React Native Debugger

I also get this error when Debugger connects to the app: (after I dismiss this error, I get the one presented above ^)

enter image description here

P.S.: I can provide any additional information. I have been struggling with this for a few days now

Solution

  • The error is being generated because the version of react-devtools of the project and that of react-devtools-core are not compatible each other. So you should look at both versions and upgrade one's or downgrade another one's. I hope it helps.