19
votes

I'm trying to get up and running with React Native and I am seeing the message below in Xcode:

Port 8081 already in use, packager is either not running or not running correctly

Command /bin/sh failed with exit code 2

I went to the React Native troubleshooting page and tried to kill the port 8081 processes, but I'm still getting the same issue.

Here is a screenshot of what I am seeing in Xcode:

error screenshots

Any help would be fully appreciated.

12

12 Answers

20
votes

If you do lsof -n -i4TCP:8081 as recommended in Facebook's troubleshooting page and get an empty result, try again using sudo lsof -n -i4TCP:8081.

In my case, it turns out McAfee anti-virus software is running process that listens on that port. Killing that process (I know, I know!) fixed the problem.

14
votes

Try the following steps for those that need to change port 8081 to a different port.

> npm start

will launch node_modules/react-native/packager/packager.sh

In there it will merge command line parameters, i.e. --port into the predefined options. i.e. port=8081

I updated the package.json start option to include my prefered port, as i was unable to stop existing services using this port.

{
  "name": "AwesomeProject",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node_modules/react-native/packager/packager.sh --port=8999"
  },
  "dependencies": {
    "react-native": "^0.12.0"
  }
}

** Note that this may not work for android which is apparently hard coded to 8081 Stack Post Here

Building Xcode When building Xcode it will still fail as it tries to run a script to launch node. You will either need to remove this script from the build process or update it to the new port.

Under libraries select React.xcodeproj. In the main screen select Build Phases. You will see Run Script.

Either remove this entry, having called npm start yourself, or edit the port.

if nc -w 5 -z localhost 8999 ; then
  if ! curl -s "http://localhost:8999/status" | grep -q "packager-status:running" ; then
    echo "Port 8999 already in use, packager is either not running or not running correctly"
    exit 2
  fi
else
  open $SRCROOT/../packager/launchPackager.command || echo "Can't start packager automatically"
fi

Debugging Seems 8081 is all over the shop. Need to additionally updated the RCTWebSocketExecutor.m under xcode-project: Libraries/RCTWebSocket.xcodeproj

- (instancetype)init
{
  return [self initWithURL:[RCTConvert NSURL:@"http://localhost:8999/debugger-proxy"]];
}

** Launching packager from iOS ** If launching only from iOS then you additionally need to edit launchPackager.command to add in the appropriate port as this file is used by Xcode to run the javascript.

$THIS_DIR/packager.sh  --port=8999
12
votes

Easy method: Try with the following code

kill -9 $(lsof -t -i:8081)
10
votes

Had the same problem!

For Android I can use adb to redirect port, but in iOS, cannot figure our a way to run React Native in a custom port. Have to take over the 8081 port from McAfee.

For those Mac user who cannot kill the McAfee process/service directly, you can unload it via launchctl(macOS), then you can run the packager server on the default 8081 port.

cd /Library/LaunchDaemons
sudo launchctl unload com.mcafee.agent.macmn.plist

Also wrote a memo to explain the launchctl detail and MacOS boot flow.

5
votes

With the help of other people's answers. I tried the following steps. It worked for me and hopefully for others. It only works for iOS. Let’s say we want to change the 8081 port to 8999 port.

First, Open Xcode.

  • Look at Project navigator(left) In [ProjectName]/[ProjectName]/AppDelegate.m:

    Change

    http://localhost:8081/index.ios.bundle?platform=ios&dev=true 
    

    to

    http://localhost:8999/index.ios.bundle?platform=ios&dev=true
    
  • In Project navigator(left) [ProjectName]/ Libraries:

    Click “React.xcodeproj”. On main panel, click “Build Phases” tag.

    Expand “Run Script”, delete it with the cross.

  • In Project navigator(left) [ProjectName] / Libraries / RCTWebSocket.xcodeproj / RCTWebSocketExecutor.m : Search 8081 and replace it with 8999

Second open Finder

In the project root, open “package.json” :

Change the “script” attribute to :

{...

    "start": "node_modules/react-native/packager/packager.sh --port=8999"
...
}

Then Open terminal

  • $cd to project root :

    $ npm start

Cool! Then

Go back to Xcode and click the play button.

Cross your fingers.

Be Patient. There will be a blank in the client.

You can see it is doing building on the backend(terminal will log it).

2
votes

run the following command:

react-native start --port=8088

I had the same issue with McAfee running on 8081. This worked for me.

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

1
votes

I figured out the issue: for some reason I didn't kill the process on port 8081 and it was causing Xcode to fail.

Solution:

  1. Kill the process on port 8081.
  2. Clean Xcode: Xcode Menu > Product > Clean.
  3. Reopen Xcode.

Resource:

React-Native Troubleshooting

0
votes

My problem was the Wifi DNS setup..

i. Go to Settings-> Network.

ii. Select the connected Wifi, click Advance.

iii. Select DNS, you might have set your DNS server to 8.8.8.8 (God knows your intention ;) ). Delete it and set it to the default 192.168.1.1. Click OK.

iv. Run the react-native run-ios in terminal and it works.

0
votes

I had the same issue running react-native run-ios ----port=8088 worked for me, did not try android yet

0
votes

I just had the same problem and found out Docker was using port 8081.

Therefore if you need to debug stuff with React Native, you need to stop docker, if it is using the same port.

0
votes

The following steps worked for me for running react-native code on iOS and XCode 10.1

  1. In the project root folder, go to ios folder and double click on {projectName}.xcodeproject file. This will open XCode.
  2. In XCode, select File >> Project Settings.
  3. This will open the settings page, in the same page change "Per-User Project Settings:" >> "Build System" from 'User Shared Setting' to 'Legacy Build System'
  4. Save your changes.
  5. Then npm install @babel/runtime --save-dev
  6. Then run the project using the command react-native run-ios --port=8088. This will run the packager in 8088 port.
0
votes

In "react" 16.8.6 and "react-native": "0.60.5"

Go to [YOURPROJECT] > ios > [YOURPROJECT].xcodeproj > project.pbxproj

CHANGE THE RCT_METRO_PORT TO YOUR PORT(EX: 8089)

Clean and build. It should work.

        shellScript = "export RCT_METRO_PORT=\"${RCT_METRO_PORT:=8089}\"\necho \"export RCT_METRO_PORT=${RCT_METRO_PORT}\" > \"${SRCROOT}/../node_modules/react-native/scripts/.packager.env\"\nif [ -z \"${RCT_NO_LAUNCH_PACKAGER+xxx}\" ] ; then\n  if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then\n    if ! curl -s \"http://localhost:${RCT_METRO_PORT}/status\" | grep -q \"packager-status:running\" ; then\n      echo \"Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly\"\n      exit 2\n    fi\n  else\n    open \"$SRCROOT/../node_modules/react-native/scripts/launchPackager.command\" || echo \"Can't start packager automatically\"\n  fi\nfi\n";

Update:

"react": "16.8.3", "react-native": "0.59.8",

node_modules > react-native > React > React.xcodeproj

Change the port from 8081 to 8082


In other versions of the react-native, search for the string RCT_METRO_PORT or already in use,. In result found, change the port from 8081 to the desired port(ex: 8082).