Troubleshooting

Troubleshooting

The react-native ecosystem is young and moves fast. As a result, it's easy to run into issues. This page is intended to collect common problems and useful solutions.

Problem: errors persist despite changes, files don't seem to be updated

The React Native packager is a long-running process that caches files. Sometimes it fails to notice that a file has changed, especially in the node_modules folder.

Solution

Stop the packager terminal window and manually start the packager with the --reset-cache true option:

app/node_modules/react-native/packager/packager.sh --reset-cache true

You should also clear watchman's state:

watchman watch-del-all

If that doesn't help, clear the temp files manually

find "$TMPDIR" -name "react-*"   -exec rm -rf {} \;

Problem: cluttered ios-log

Looking at my iOS simulator log using react-native log-ios, there are many warning and error messages. For example:

Jul 30 13:04:36 Computer assertiond[44995] <Error>: assertion failed: 15F34 13E230: assertiond + 15801 [3C808658-78EC-3950-A264-79A64E0E463B]: 0x1
Jul 30 13:04:36 Computer Unknown[44995] <Error>:

Solution

As far as I can tell, these messages are expected to occur in the iOS simulator and harmless. There's no known way to hide these (useless) warnings.

Problem: console.error "Reload websocket error"

This red screen means that the ClojureScript code cannot create a connection to the "Boot Reload" websocket.

Solution

The error can occur in a number of different situations:

• boot dev (which opens the reload websocket) is not running

• There's a network problem that prevents the app to reach port 8079 on localhost.

  This often happens on Android because the Android emulator uses an emulated network device. In this case, the solution is to run adb reverse tcp:8079 tcp:8079 after the emulator has started.

• There's a problem with previous JavaScript code. In this case it can be helpful to inspect the app log for earlier error messages.

Problem: Android sdk location error

When trying to build the android app with 'react-native run-android' get an error about SDK location.

> SDK location not found. Define location with sdk.dir in the local.properties file or with an ANDROID_HOME environment variable.

Solution

export ANDROID_HOME=/Users/<username>/Library/Android/sdk/
export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools

Problem: goog.require could not find: cljs.core

This problem occurs because the unpatched version of the RN packager cannot find dependencies loaded using goog.require.

Solution

Patch the bundled patch for the packager to the react-native npm module:

$ cd example
$ patch -d app/node_modules/react-native -p1 < rn-goog-require.patch
patching file packager/react-packager/src/JSTransformer/worker/extract-dependencies.js
$ app/node_modules/react-native/packager/packager.sh --reset-cache true

Problem: Android version error

You've downloaded the latest version of Android so you get messages asking for android 23.

> failed to find target with hash string 'android-23' in: /Users/<username>/Library/Android/sdk

Solution

Go to the Android SDK manager, select API level 23, and install.

Problem: Android Build Tools version error

You've downloaded the latest version of Android so you get an error about the necessary Build Tools version.

> failed to find Build Tools revision 23.0.1

Solution

'android list sdk -a', look for the number next to 'Android SDK Build-tools, revision 23.0.1' 'android update sdk -a -u -t '

Problem: Android builder device list error

You see this error

com.android.builder.testing.api.DeviceException: Timeout getting device list.

Solution

Go to settings/ADB in Genymotion and add the path to your Android SDK under "Use custom Android SDK tools" ex. /Users/<username>/Library/Android/sdk

Problem: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - process out of memory

The issue is that the RN packager (react-native bundle) has trouble bundling Google Closure-generated files and runs out of memory.

Solution

• instead of using advanced optimization, use simple optimization
• call node with the --max_old_space_size=4096 flag
• for more options, see the github issue.

Problem: error requiring assets after reloading

When reloading a cljs file that requires an asset (image) using (js/require "../logo.png"), an error appears:

Requiring unknown module "..//logo.png"

The problem is that, when a file is loaded using boot-reload, the file doesn't properly pass through the RN packager.

Solution

Use defonce to make sure images are required only the first time the namespace is loaded:

(defonce logo (js/require ".../logo.png"))

Also see this issue

Problem: Unable to execute JS call: __fbBatchedBridge is undefined

On startup you see a Red Screen containing the message Unable to execute JS call: __fbBatchedBridge is undefined.

This often happens when building a release version of the app using an "offline bundle". The error is typically a red herring. It indicates that something went wrong during the JavaScript (ClojureScript) initialization phase earlier in the execution of the program.

Solution

Look at the device/simulator log if any exceptions or error messages were printed out before the issue. It's also worth inspecting the offline bundle to see if it was built correctly.

Problem: Error watching for file changes: EMFILE

Solution

brew install watchman