React NativeTroubleshooting #
These are some common issues you may run into while setting up React Native. If you encounter something that is not listed here, try searching for the issue in GitHub.
Port already in use #
The React Native packager runs on port 8081. If another process is already using that port (such as McAfee Antivirus on Windows), you can either terminate that process, or change the port that the packager uses.
Terminating a process on port 8081 #
Run the following command on a Mac to find the id for the process that is listening on port 8081:
$ sudo lsof -n -i4TCP:8081 | grep LISTEN
Then run the following to terminate the process:
$ kill -9 <PID>
Using a port other than 8081 #
You can configure the packager to use a port other than 8081 by using the port parameter:
$ react-native start --port=8088
You will also need to update your applications to load the JavaScript bundle from the new port.
To change the port used by an iOS application, edit the AppDelegate.m file in the ios folder. Scroll down to the line where the bundle location is defined, and replace 8081 with the new port.
NPM locking error #
If you encounter an error such as "npm WARN locking Error: EACCES" while using the React Native CLI, try running the following:
Troubleshooting #
These are some common issues you may run into while setting up React Native. If you encounter something that is not listed here, try searching for the issue in GitHub.
Port already in use #
The React Native packager runs on port 8081. If another process is already using that port (such as McAfee Antivirus on Windows), you can either terminate that process, or change the port that the packager uses.
Terminating a process on port 8081 #
Run the following command on a Mac to find the id for the process that is listening on port 8081:
$ sudo lsof -n -i4TCP:8081 | grep LISTEN
Then run the following to terminate the process:
$ kill -9 <PID>
On Windows you can find the process using port 8081 using Resource Monitor and stop it using Task Manager.
Using a port other than 8081 #
You can configure the packager to use a port other than 8081 by using the port parameter:
$ react-native start --port=8088
You will also need to update your applications to load the JavaScript bundle from the new port.
To change the port used by an iOS application, edit the AppDelegate.m file in the ios folder. Scroll down to the line where the bundle location is defined, and replace 8081 with the new port.
NPM locking error #
If you encounter an error such as "npm WARN locking Error: EACCES" while using the React Native CLI, try running the following:
Missing libraries for React #
If you added React Native manually to your project, make sure you have included all the relevant dependencies that you are using, like RCTText.xcodeproj, RCTImage.xcodeproj. Next, the binaries built by these dependencies have to be linked to your app binary. Use the Linked Frameworks and Binaries section in the Xcode project settings. More detailed steps are here: Linking Libraries.
If you are using CocoaPods, verify that you have added React along with the subspecs to the Podfile. For example, if you were using the <Text />, <Image /> and fetch() APIs, you would need to add these in your Podfile: