Running React Native in WSL with the emulator running directly in Windows

AFAIK it is not possible to use react-native in WSL due to a number of issues.

e.g. https://github.com/Microsoft/BashOnWindows/issues/1523

However, I've found a workaround that combines a native windows android build with a npm stack in WSL. Realistically, you'll want to install the native Windows Android Studio/SDK to use the Intellij IDE and the emulator anyway. The trick is to separate out the Gradle based Android compile.

Workflow

All project setup and package management performed in WSL with npm/yarn. react-native-cli installed globally in WSL. No need for a duplicate windows binary node/npm stack.

Don't use react-native run-android, instead compile and deploy from cmd. From the /android directory inside your project, execute the gradle wrapper gradlew.bat installDebug, or with the Creator's Update, you can do this from inside the WSL bash shell /mnt/c/Windows/System32/cmd.exe /C gradlew.bat installDebug. Don't use the unix gradlew script.

Once the APK has been assembled and uploaded to your device or emulator, run the debug server from within WSL using the command react-native start.

I've tested this out with some fairly complex projects using multiple native Android components. Hope this helps.

  • Note: For this to work your project needs to be located in the native Windows file system i.e. /mnt/c.

It is possible to set it up so that the emulator runs in Windows while running react-native run-android in WSL. The benefits of doing it this way over @pscl's way is that this way supports autolinking. Here is what you need to do to get it working.

Windows

The only thing required on the Windows side is to install Android Studio and setup the emulator / virtual device. This is pretty straightforward so I'm not gonna walk you through that.

Windows Subsystem for Linux

There's a bit more to setting up this side of things, so bear with me. (My WSL is Ubuntu 18.04, this is untested on other flavors.)

  1. Download and unzip the Android command line tools. (Currently found on the Android Studio download page, scroll down to "Command line tools only" and select the Linux download option.)
  2. Look inside the unzipped folder and move the directory named tools to ~/Android/Sdk/tools. (Create the ~/Android/Sdk directories if they don't exist.)
  3. Download and unzip JDK 8. (I recommend downloading from AdoptOpenJDK. Also, make sure to install OpenJDK 8 otherwise sdkmanager won't work, which we use later.)
  4. Move the unzipped folder to /opt/jdk8u222-b10. (You can actually put this wherever you want, just make sure the JAVA_HOME environment variable points to this unzipped folder.)
  5. Set the following environment variables in your ~/.bashrc file. (The paths could be different for you!)
export ANDROID_HOME=/home/your-name/Android/Sdk
export JAVA_HOME=/opt/jdk8u222-b10
export PATH=$PATH:$ANDROID_HOME/platform-tools
export PATH=$PATH:$ANDROID_HOME/tools/bin
  1. Restart your bash terminal and execute the command sdkmanager "platform-tools" to download the latest platform tools. (The adb tool comes from here.)

React Native

Now that everything is setup, it's time to play!

  1. Start the emulator in Windows.
  2. Open your project directory in WSL and run react-native start. (Keep this terminal open).
  3. Open your project directory in another WSL terminal and run react-native run-android. (The first time you run this, React Native will download a few other SDKs based on your virtual device. You can see all installed SDKs by running sdkmanager --list. See the docs for sdkmanager for more info.)

Running on Device

This is a quick note on making it so you can install your app to a physical device. The trick here is making sure both of your adb executables are on the same version. (They should be since we installed it through sdkmanager.)

C:\Users\your-name\AppData\Local\Android\Sdk\platform-tools\adb.exe version
/home/your-name/Android/Sdk/platform-tools/adb version

Once you've confirmed that they are on the same version, make sure you start the adb server from the windows executable (Run adb.exe kill-server && adb.exe start-server). Then you can test if it works by running adb devices in WSL and you should see your device that is plugged in.