React Native Expo WSL2 Fix Ip Address QR Code

readme.md

First

Create the file reactnative_expo_wsl2_fix.ps1

Second

Create a shortcut named ReactNative Expo WSL2 Fix

The target need to be powershell.exe -ExecutionPolicy Bypass -f "PATH TO THE LOCATION OF reactnative_expo_wsl2_fix.ps1 FILE"

Example: powershell.exe -ExecutionPolicy Bypass -f "C:\Users\elonmusk\OneDrive\Documents\reactnative_expo_wsl2_fix.ps1"

Run the shorcut as administrator, wait and hit enter when finish.

Third

Update your package.json and insert a new option scripts section as you see on that package.json

Then run npm run startwsl.

if the npm run startwsl does not update your ip address, maybe your interface name is incorrect.

To check the correct interface name, just type on powershell netsh.exe interface ip show address, get the correct name and update on the package.json -> scripts section.

package.json

{
  "scripts": {
    "startwsl": "REACT_NATIVE_PACKAGER_HOSTNAME=$(netsh.exe interface ip show address 'Wi-Fi 2' | grep 'IP Address' | sed -r 's/^.*IP Address:\\W*//') expo start",
  }
}

reactnative_expo_wsl2_fix.ps1

# Find WSL2 IP address
$wsl_ip = $(wsl hostname -I).Trim();
$windows_ip = '0.0.0.0';

if ( -Not $wsl_ip ) {
  Write-Output "IP address for WSL 2 cannot be found";
  exit;
}

Write-Output $wsl_ip
Write-Output $windows_ip

# Remove all previously proxied ports (only if not using other ports!)
Invoke-Expression "netsh int portproxy reset all"

# Remove Firewall Exception Rules
Invoke-Expression "Remove-NetFireWallRule -DisplayName 'Expo WSL2 Ports' ";

# Allow Expo ports through Windows Firewall
New-NetFireWallRule -DisplayName 'Expo WSL2 Ports' -Direction Inbound -LocalPort 19000-19006 -Action Allow -Protocol TCP;
New-NetFireWallRule -DisplayName 'Expo WSL2 Ports' -Direction Outbound -LocalPort 19000-19006 -Action Allow -Protocol TCP;

# Proxy Expo ports to WSL2
netsh interface portproxy add v4tov4 listenport=19000 listenaddress=$windows_ip connectport=19000 connectaddress=$wsl_ip;
netsh interface portproxy add v4tov4 listenport=19001 listenaddress=$windows_ip connectport=19001 connectaddress=$wsl_ip
# NOTE: Avoid proxying port 19002, as this will prevent loading the Expo dev tools on the host (browser)!

# Show all newly proxied ports
Invoke-Expression "netsh interface portproxy show v4tov4"

cmd /c pause