4

I'm trying to install the standalone react-devtools, which by default listens to port 8097. My app uses port 3001. The documentation says the following:

"By default DevTools listen to port 8097 on localhost. If you need to customize host, port, or other settings, see the react-devtools-core package instead."

How do I go about changing the port to listen to 3001 instead?

Source: https://github.com/facebook/react-devtools/tree/master/packages/react-devtools

Paul Roub
  • 36,322
  • 27
  • 84
  • 93
a7dc
  • 3,323
  • 7
  • 32
  • 50

2 Answers2

4

The docs advise to have a look at react-devtools-core:

require('react-devtools-core').connectToDevTools(options)

This is similar to require('react-devtools') in another package but providing more control. Unlike require('react-devtools'), it doesn't connect immediately, but exports a function.

Run connectToDevTools() in the same context as React to set up a connection to DevTools. Make sure this runs before any react, react-dom, or react-native imports.

The options object may contain:

  • host (string), defaults to 'localhost'.
  • port (number), defaults to 8097.
  • resolveRNStyle (function), used by RN and null by default.
TimoStaudinger
  • 41,396
  • 16
  • 88
  • 94
  • humble, literally. – arcom Aug 24 '17 at 14:53
  • 1
    Where should I put this for **React Native**? I have tried put at root `index.js` and `App.js`, then run `npx react-devtools` and it doesn't change at all. The docs isn't helpful much, there's no issue on GitHub about it and it stress me out that there's no example for it. – Kaydarin Sep 27 '21 at 13:42
3

You can also change your emulator or device port to 8097. Worked for me.

Eg: adb -s <device-name> reverse tcp:8097 tcp:8097

How to find device name: run adb devices

Nishit Mehta
  • 73
  • 5