loading...

Web & React Native development in WSL

mikolaj6r profile image Mikołaj Romanowski ・2 min read

Intro

As many of You, I like Windows for it's simplicity, but developing software on that OS sometimes can turn into a nightmare. Recently Windows released WSL2 - big update to Windows Subsystem for Linux, which brought:

  • new architecture
  • full Linux kernel
  • much, much faster IO
  • easy to install Docker
  • more info here

Although WSL2 has many improvements towards its predecessor, it has also some downsides like virtual network hidden behind NAT and lack of access to USB devices.

Before

First, assure that You have WSL2 installed (check this link).

Secondly, I strongly encourage to check Windows Terminal (which is open-sourced on Github)

Setup

Add the snippet below to the end of Your shell config file (usually .bashrc or .profile)

export $(dbus-launch)
export LIBGL_ALWAYS_INDIRECT=1

export WSL_HOST=$(tail -1 /etc/resolv.conf | cut -d' ' -f2)
export DISPLAY=$WSL_HOST:0

export ADB_SERVER_SOCKET=tcp:$WSL_HOST:5037

Now Your WSL is ready.
You can:

  • install some GUI on linux and use Windows X Server to run graphic apps from linux (e.g develop some Electron-based apps)
  • develop mobile apps using React Native (just follow official instructions for Linux)

React Native & adb

There's one more thing about adb. You have to start it under Windows (e.g. cmd)
As You remember, there's no USB support in WSL :)

Final steps:
1) Start adb server in windows
2) Enable port fowarding to metro bundler from Windows
3) Follow React Native docs. Remember to execute commands under WSL, not Windows.

Final note

That's my first post in the DEV community :) Please give me some feedback.

Posted on by:

Discussion

markdown guide
 

Error image
I have problem with adb devices on wsl2. If I set ADB_SERVER_SOCKET, adb always throw segmentation fault error. Any idea how to resolve this problem?