Skip to content

Latest commit

 

History

History
107 lines (68 loc) · 6.38 KB

troubleshooting.md

File metadata and controls

107 lines (68 loc) · 6.38 KB
Raw

Troubleshooting

I got Unsupported meesage from React DevTools

If you're using React Native version >= 0.62 and keep React Native Debugger as the latest version, here is what you can do:

In your app project, make sure the react-devtools-core dependency to match the React DevTools version. Add resolutions in your package.json for Yarn:

{
  "resolutions": {
    "react-devtools-core": "~4.28.0"
  }
}

or NPM:

{
  "overrides": {
    "react-devtools-core": "~4.28.0"
  }
}

Reference: Unsupported DevTools backend version - # React Native Debugger

If the React Native version of your project doesn't support react-devtools-core@4.25, please consider downgrade React Native Debugger version to v0.12.

Network fetch got issue like SyntaxError: Unexpected token o in JSON at position 1 if Network Inspect enabled

This may be caused by some library used / made fetch polyfills, it may used Blob but RNDebugger does not support it. If you got this issue, try to use global fetch / XMLHttpRequest instead, or try #382#issuecomment-544226529.

Debugger causes app to load stale JS bundle (#423)

This issue was fixed by v0.10.9 and v0.11.1. If you are still using the old version for some reason, you can turn off Network cache manually on devtools:

image

Some shortcuts (e.g. Reload / Clear AsyncStorage) are missing on the Debugger

  • For Android and React Native version less than v0.60, you need to add and link react-native-devsettings-android package
  • If you're not using dev bundle (dev=true) from React Native packager, it will not working as expected.
  • For some reasons, some dependencies may affected Promise behavior. It is recommended to use the initial project to find out the reason.
  • If you are sure it is caused by a new version of React Native, please file an new issue.

How to resolve problem of high memory usage on devtools?

You may have got a problem when you often reload JS, devtools process takes your RAM even more than 1G, it does not seem to clean.

In case of using official remote debugger, tested a initial project with remote debugging mode on Chrome 62 (beta), continuous reload JS 30 times:

Before:
2017-09-19 5 32 05 pm

After:
2017-09-19 5 31 33 pm

Fortunately, the current versions of RNDebugger (Chromium 58) is better than Chrome (maybe >= 59?), but it still has a amount of growth:

Before:
2017-09-19 5 40 18 pm

After:
2017-09-19 5 41 27 pm

To avoid similar problems in the future, there is a way to restart the Chrome devtools (macOS: CMD+OPTION+I, Linux/Windows: CTRL+ALT+I), the same applies to official remote debugger on Chrome. You can also consider to use timesJSLoadToRefreshDevTools option in Config file in home directory.

[iOS] Debugger can't load bundle when I use real device

If you're getting the following error:

It may caused by xip.io service (RN use it for debug on real device), it lead your machine IP doesn't resolved sometimes. It's enabled by default, you can disable it in RN custom script on Xcode if you sure you don't need the service:

2017-07-31 1 19 34

React Inspector get stuck at "Connecting to React…" for RN ^0.43 (#45)

It usually on Android, the problem is related to requestIdleCallback API (try to check if it not work on debug mode).

This issue have been fixed in react-devtools-core@^2.3.0, please ensure the version is correct in your React Native project (Note that it's dependency of react-native).

Also, sometimes it have timer problem between host machine and device (emulator), you need make sure date & time setting is correct:

2017-07-18 10 09 01

Or try to restart your device (emulator).

[Windows 10] React native debugger process starts but no visible window (#459)

This issue is caused by Windows 10 dark mode, for a workaround please disable dark mode and enable it again after launching react-native-debugger

Other documentations