React-native-windows: Can't run android

Created on 22 May 2019  ยท  15Comments  ยท  Source: microsoft/react-native-windows

problem

JS server already running.
Building and installing the app on the device (cd android
&& ./gradlew installDebug)...

Configure project :app
WARNING: The specified Android SDK Build Tools version (28
.0.2) is ignored, as it is below the minimum supported ver
sion (28.0.3) for Android Gradle Plugin 3.2.1.
Android SDK Build Tools 28.0.3 will be used.
To suppress this warning, remove "buildToolsVersion '28.0.
2'" from your build.gradle file, as each version of the An
droid Gradle Plugin now has a default version of the build
tools.

Task :app:compileDebugJavaWithJavac FAILED
/Users/namprik/Projects/React-Native/bplusapp/android/app/
src/main/java/com/bplusapp/MainApplication.java:5: error:
cannot find symbol
import com.facebook.react.ReactApplication;
^
symbol: class ReactApplication
location: package com.facebook.react
/Users/namprik/Projects/React-Native/bplusapp/android/app/
src/main/java/com/bplusapp/MainApplication.java:6: error:
cannot find symbol
import com.facebook.react.ReactNativeHost;
^
symbol: class ReactNativeHost
location: package com.facebook.react
/Users/namprik/Projects/React-Native/bplusapp/android/app/
src/main/java/com/bplusapp/MainApplication.java:14: error: cannot find symbol
public class MainApplication extends Application implements ReactApplication {
^
symbol: class ReactApplication
/Users/namprik/Projects/React-Native/bplusapp/android/app/src/main/java/com/bplusapp/MainApplication.java:16: error: cannot find symbol
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
^
symbol: class ReactNativeHost
location: class MainApplication
/Users/namprik/Projects/React-Native/bplusapp/android/app/src/main/java/com/bplusapp/MainApplication.java:36: error: cannot find symbol
public ReactNativeHost getReactNativeHost() {
^
symbol: class ReactNativeHost
location: class MainApplication
/Users/namprik/Projects/React-Native/bplusapp/android/app/src/main/java/com/bplusapp/MainApplication.java:16: error: cannot find symbol
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
^
symbol: class ReactNativeHost
location: class MainApplication
/Users/namprik/Projects/React-Native/bplusapp/android/app/src/main/java/com/bplusapp/MainApplication.java:35: error: method does not override or implement a method from a supertype
@Override
^
/Users/namprik/Projects/React-Native/bplusapp/android/app/src/main/java/com/bplusapp/MainActivity.java:5: error: MainActivity is not abstract and does not override abstract method getPackages() in ReactActivity
public class MainActivity extends ReactActivity {
^
8 errors

FAILURE: Build failed with an exception.

  • What went wrong:
    Execution failed for task ':app:compileDebugJavaWithJavac'.

    Compilation failed; see the compiler error output for details.

  • Try:
    Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

  • Get more help at https://help.gradle.org

BUILD FAILED in 4s
15 actionable tasks: 7 executed, 8 up-to-date
Could not install the app on the device, read the error ab
ove for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/getting-started.html

Command failed: ./gradlew installDebug

Error: Command failed: ./gradlew installDebug
at checkExecSyncError (child_process.js:631:11)
at Object.execFileSync (child_process.js:649:15)
at runOnAllDevices (/Users/namprik/Projects/React-Native/bplusapp/node_modules/react-native/local-cli/runAndroid/runAndroid.js:299:19)
at buildAndRun (/Users/namprik/Projects/React-Native/bplusapp/node_modules/react-native/local-cli/runAndroid/runAndroid.js:135:12)
at /Users/namprik/Projects/React-Native/bplusapp/node_modules/react-native/local-cli/runAndroid/runAndroid.js:65:12
at processTicksAndRejections (internal/process/task_queues.js:89:5)

This is my react environment

React Native Environment Info:
System:
OS: macOS 10.14.4
CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Memory: 42.12 MB / 8.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 12.1.0 - /usr/local/bin/node
Yarn: 1.15.2 - /usr/local/bin/yarn
npm: 6.9.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
Android SDK:
API Levels: 23, 24, 25, 26, 27, 28
Build Tools: 23.0.1, 25.0.0, 25.0.1, 25.0.2, 25.0.3, 26.0.1, 26.0.2, 26.0.3, 27.0.0, 27.0.3, 28.0.2, 28.0.3
System Images: android-23 | Intel x86 Atom, android-23 | Intel x86 Atom_64, android-23 | Google APIs ARM EABI v7a, android-23 | Google APIs Intel x86 Atom, android-23 | Google APIs Intel x86 Atom_64, android-24 | ARM 64 v8a, android-24 | ARM EABI v7a, android-24 | Intel x86 Atom, android-24 | Intel x86 Atom_64, android-24 | Google APIs ARM EABI v7a, android-24 | Google APIs Intel x86 Atom_64, android-24 | Google Play Intel x86 Atom, android-25 | Google Play Intel x86 Atom, android-27 | Google APIs Intel x86 Atom, android-27 | Google Play Intel x86 Atom, android-P | Intel x86 Atom_64, android-P | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.3 AI-182.5107.16.33.5264788
Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
npmPackages:
react: 16.6.3 => 16.6.3
react-native: https://github.com/microsoft/react-native/archive/v0.58.6-microsoft.48.tar.gz => 0.58.6-microsoft.48
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

Most helpful comment

Here's what's going on : the react-native-windows _vnext_ implementation is a work in progress and is currently off of a /Microsoft fork of react-native which we are working to get off of (see Issue #2264 where we are tracking this work).

The problem you are hitting is because we have added code to this fork for improving the windows story (keyboarding, mouse hover, accessibility etc.,) which is conflicting with the base react-native implementation and hence it is not in a great state for xplat development right now. We are tracking the cleaning up of the react-native-windows _vnext_ implementation to remove the windows-specific extensions through Issue #2535.

Until these tasks are done, there are 2 possible options for xplat development (running on android/iOS while developing/running on Windows as well):

  • Use react-native-windows _current_ and not vnext until the above issues are completed. We intend to provide a migration path from current to vnext once the vnext implementation is mature and has more feature parity (ETA : EOY 2019). So, you can start now using current and migrate your app to vnext once we are ready for prime time.
  • If using vnext, you can manually edit the package.json and run npm install before switching between platforms as shown in the workaround below. This makes the developer experience a bit clunky, but lets you work around the current limitation until the above issues are fixed.

Work-around details:

  1. Edit the package.json file in the vnext folder as follows:
    When building for windows, point dependencies to Microsoft/react-native fork and start scripts to the windows CLI:
  "scripts": {
        ...
        "start": "node node_modules/react-native-windows/Scripts/cli.js start",
        ...
  }
  "dependencies": {
        ...
        "react-native": " https://github.com/Microsoft/react-native/archive/v0.58.6-microsoft.34.tar.gz",
        ...
  },

When building for iOS/Android, point dependencies to react-native and start scripts to react-native CLI:

  "scripts": {
        ...
        "start": "node node_modules/react-native/Scripts/cli.js start",
        ...
  }
  "dependencies": {
        ...
        "react-native": "0.59.8", 
        ...
  },
  1. run npm install
  2. run react-native run-windows (or) react-native run-android as the case may be.

All 15 comments

Thanks for raising this issue. Can you clarify if you are trying to run react-native-windows on an android device?

Thanks for raising this issue. Can you clarify if you are trying to run react-native-windows on an android device?

I can run react-native run-android in project react-native-windows ?

Hi ๐Ÿ˜ƒ
Maybe, I'm in same issue now!

I ran on my cmd.exe

> cd path\to\react-native-windows-project
> react-native run-windows
(The application window opened correctly)
> react-native run-android

and then https://github.com/microsoft/react-native-windows/issues/2515#issue-446929224 error mesesage shew.

:sob:

Exactly the same issue here.
@harinikmsft any news about this?

Exactly as reepias and aiya000 explain, running the windows command, opens up the windows emulator correctly and runs the app correctly too. When running react-native run-android command, then we get this error message.

@reepias It's 6 days ago you reported this, did you have any progress by any chance?

Following

@rozele , @in4margaret - can one of you take a look to see what's going on? Looks like its an issue in the current version and tool chain for android.

It's happening in the vnext version. Not the current.

Oh, thanks for clarifying @MakhouT . Let me circle back with the crew and see if we can get to the bottom of this as soon as possible.

( I'm on vnext too ๐Ÿ˜‚ )

Here's what's going on : the react-native-windows _vnext_ implementation is a work in progress and is currently off of a /Microsoft fork of react-native which we are working to get off of (see Issue #2264 where we are tracking this work).

The problem you are hitting is because we have added code to this fork for improving the windows story (keyboarding, mouse hover, accessibility etc.,) which is conflicting with the base react-native implementation and hence it is not in a great state for xplat development right now. We are tracking the cleaning up of the react-native-windows _vnext_ implementation to remove the windows-specific extensions through Issue #2535.

Until these tasks are done, there are 2 possible options for xplat development (running on android/iOS while developing/running on Windows as well):

  • Use react-native-windows _current_ and not vnext until the above issues are completed. We intend to provide a migration path from current to vnext once the vnext implementation is mature and has more feature parity (ETA : EOY 2019). So, you can start now using current and migrate your app to vnext once we are ready for prime time.
  • If using vnext, you can manually edit the package.json and run npm install before switching between platforms as shown in the workaround below. This makes the developer experience a bit clunky, but lets you work around the current limitation until the above issues are fixed.

Work-around details:

  1. Edit the package.json file in the vnext folder as follows:
    When building for windows, point dependencies to Microsoft/react-native fork and start scripts to the windows CLI:
  "scripts": {
        ...
        "start": "node node_modules/react-native-windows/Scripts/cli.js start",
        ...
  }
  "dependencies": {
        ...
        "react-native": " https://github.com/Microsoft/react-native/archive/v0.58.6-microsoft.34.tar.gz",
        ...
  },

When building for iOS/Android, point dependencies to react-native and start scripts to react-native CLI:

  "scripts": {
        ...
        "start": "node node_modules/react-native/Scripts/cli.js start",
        ...
  }
  "dependencies": {
        ...
        "react-native": "0.59.8", 
        ...
  },
  1. run npm install
  2. run react-native run-windows (or) react-native run-android as the case may be.

Thanks for clarifying this @harinikmsft
I know how to proceed now.

Closing this issue as the main underlying issues are being tracked by #2535 and #2264 as mentioned in the above comment. I will submit a PR shortly where this is being referenced in the troubleshooting section of the vnext Getting Started Guide

Happy to report that we have addressed the underlying issues here and validated internally. You no longer need the above workarounds to add react-native-windows to your RN projects. You can stay on the main facebook/react-native fork and simply add react-native-windows and things should work!

tagging : @MakhouT , @aiya000 , @dlwsacrez, @reepias so you see this update. Thanks for flagging this! Let us know if you still see issues after removing the workaround from earlier.

Cool!! Happy to hear! Nice progress guys!
I won't be able to test it at the moment, as we have already integrated react-native-navigation in our app. I've also raised a ticket for this https://github.com/microsoft/react-native-windows/issues/2546
When that's done, I happy to test it.
When I get some free time I'll also be glad to test it in a new small project and provide you with some feedback!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

GurtejSafaltek picture GurtejSafaltek  ยท  3Comments

dubiao picture dubiao  ยท  3Comments

qmatteoq picture qmatteoq  ยท  3Comments

rozele picture rozele  ยท  4Comments

fatfatson picture fatfatson  ยท  3Comments