React Native cannot find development server, integrating existing android app

Question

I'm trying to integrate an existing android app with React Native, following the guide. It compiles and runs, but when I launch the React activity, it crashes with:

Caused by: java.lang.RuntimeException: Could not connect to development server.

I've tried both in an emulator (genymotion) and on a usb-connected device. I've run adb reverse tcp:8081 tcp:8081 and verified with adb reverse --list, and furthermore verified that I can access http://localhost:8081/index.android.bundle from the browser on device, in addition to from my laptop (so the package server is running fine, via npm start).

Notably, I can run the tutorial example fine, so it seems to be something about running RN from inside my existing Android app.

I'm on react-native 0.27.2.

ideas?

Update: I added some code to fetch the bundle directly from one of my activities:

public void pingReactServer() {
    Request request = new Request.Builder()
            .url("http://10.0.3.2:8081/index.android.bundle")
            .build();
    OkHttpClient client = OkHttpClientProvider.getOkHttpClient();
    client.newCall(request).enqueue(
            new Callback() {
                @Override
                public void onFailure(Call call, IOException e) {
                    Log.v(TAG, "React ping failed: " + call);
                }

                @Override
                public void onResponse(Call call, Response response) throws IOException {
                    Log.v(TAG, "React ping response: " + response.body().string());
                }
            }
    );
}

This works fine, I get back the bundle content. So React's http client can see the packager server, and something else must be causing an error when fetching the bundle the normal way (the DevServerHelper).

Answer 1

Figured it out, it was a series of unfortunate events:

The example code in the tutorial shows this:

mReactInstanceManager = ReactInstanceManager.builder()
    ...
    .setUseDeveloperSupport(BuildConfig.DEBUG)

but BuildConfig.DEBUG is actually defined as false, so this disables developer support (instead it expects to find the js bundle as an asset).

After I fixed that, I ran into another problem involving Proguard; it had stripped out all the devsupport classes, so I needed to whitelist them in my proguard configuration, using:

# Keep developer support classes.
-keep class com.facebook.react.devsupport.** { *; }

Now I got as far as the ReactInstanceManager loading and getting the bundle from the development server, but hit one more speedbump:

Error: Requiring unknown module "react".If you are sure the module is there, try restarting the packager or running "npm install".

Not sure why npm install wasn't pulling this in automatically, but running this manually fixed it:

npm install react@15.1.0

(use the specific version listed in node_modules/react-native/package.json.)