How change React Native and Metro Bundler port

Question

I'm trying to start the React Native debugger and bundler in port 8088 because 8081 used by another program, using the following command:

react-native run-android --port=8088

The emulator reverse is set correctly

Running C:\Users\MyUser\AppData\Local\Android\Sdk/platform-tools/adb -s emulator-5554 reverse tcp:8088 tcp:8088

But metro bundler is starting in port 8081

Which would be the best way to start it once some program is reading my 8081 port and I can't stop it.

Answer 1

There are two files needed to be modified about port 8081:

1.react-native/local-cli/server/server.js - default

2.react-native/React/React.xcodeproj/project.pbxproj - replace all the 8081 ports with your desired ports in above two files

Your port will be changed.

Answer 2

I was trying to get my RN app running on port 8088 instead of default port 8081. I've spend almost 2 days to figure out how to do this, but the solutions found were not working in my case. Finally i've found a way to tackle this problem. Follow the 3 steps and get this resolved.

1. In metro.config.js file, add the following snippet within the module.exports.

server: { port: 8088, }

2. Search for 8081 in the entire ios project and replace the value with 8088. I had to do this in the following files for the variable RCT_METRO_PORT.

• ios/Pods/Headers/Private/React-Core/React/RCTDefines.h
• ios/Pods/Headers/Public/React-Core/React/RCTDefines.h

3. Run the build as usual, this time with the port passed as an argument.

npx react-native run-ios --port 8088

Thanks!