React native change listening port

I am using react native android and having face issue to deploy the app on android device. When I run

react-native start, it won't start dev sever on port 8081

I have tried few options mentioned at:

1) https://facebook.github.io/react-native/docs/troubleshooting.html

2) Tried to stop process running at port number 8081, but no success

My question is that can we change the react native dev server port from 8081 (which is default in android howwever the same we can change in ios from AppDelegate.m file) to some thing else or any other approach

Your responses will be highly appreciated. Thanks

Not sure if this is documented or not[1], you can specify the port via a CLI argument, like this:

react-native start --port 9988

I found it in the source code, and it worked on my local machine :)

https://github.com/facebook/react-native/blob/master/local-cli/server/server.js#L30


[1] This is now documented here: http://facebook.github.io/react-native/docs/running-on-device-android.html#configure-your-app-to-connect-to-the-local-dev-server-via-wi-fi

I know it is late but FYI, there is also another way where you can change your port permanently.

Go to your_app\node_modules\react-native\local-cli\server\server.js and change the port 8081 to 8088

which will be something like this

    ...
      module.exports = {
      name: 'start',
      func: server,
      description: 'starts the webserver',
      options: [{
        command: '--port [number]',
        default: 8088,
        parse: (val) => Number(val),
      }
     ...

After spending a whole day and going through many solutions, a combination of the suggestions helped me resolve this. Follow the steps given below:

  1. Create the project using the command: 'react-native init [PROJECT_NAME]'

  2. Open the project in Xcode and replace all occurrences of "8081" with "8088" and save the changes

  3. Open terminal and change the working directory to the above created project directory. Use the following command to change the port that react native uses: react-native start --port 8088

Once you run this command, you see the following output in the terminal:

As you can see, this starts the the Metro instance. Do not kill the command or the terminal window. Let this process run.

  1. Open a new terminal window, change the working directory to the project directory and run the react-native project using the command:

react-native run-ios

Once the project builds successfully on the second terminal, you will see a progress bar indicating the loading of the app bundle in the first terminal window as shown below:

On completion of loading the bundle, the app succesfully launches on the simulator

Hope this helps. Happy coding

You can use this react-native-port-patcher which replaces the default 8081 port with your desired port number.

Set RCT_METRO_PORT, example:

export RCT_METRO_PORT=8765

Follow the steps :

Step 1:

vim node_modules/react-native/local-cli/server/server.js

Step 2 : change the default port - any other port //example -> 8089

Step 3 : go back to the project -> and do npm start

export RCT_METRO_PORT=8082
react-native start --port $RCT_METRO_PORT
react-native run-ios

https://facebook.github.io/react-native/docs/troubleshooting#using-a-port-other-than-8081

Comments

Popular posts from this blog

Meaning of `{}` for return expression

Get current scroll position of ScrollView in React Native

flutter websocket connection issue