Invalid Date
WSL2上でExpoを起動し、LANで接続する
tonnel接続を利用すればWSL2でexpoを利用すること自体は簡単だが、不安定な気がしたのでLAN接続も試してみる。
こちらの記事を参考(丸コピー)にして試してみたが、日本語環境だったりするせいかうまく実行できなかった。
自分の環境で動くようにしてみたのでメモしておく。(grepするあたりとかだけ環境に合わせて直せば動いてくれた)
やっていることは以下
- Expoが利用する19000~19006のファイアウォールを開ける
- 19000, 19001ポートをWSLへフォワードする
- Expoを起動する際にWSLのipアドレスではなくwindows側のipアドレスで実行するように設定する
unlock_expo_port.ps1
# 作業前に以下のコマンドを”管理者権限のPowershell”で実行することでExpoのポートを開放&フォワードする
#
# ```
# powershell.exe -ExecutionPolicy Bypass -f \\wsl.localhost\Ubuntu\***repo-path***\tools\unlock_expo_port.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
↑このスクリプトを作業前に実行する(管理者権限かつExecutionPolicy Bypass)。 自動で走らせてもいいが、自分は作業前に都度実行。
jsonpackage.json
"scripts": {
"start:wsl": "REACT_NATIVE_PACKAGER_HOSTNAME=$(netsh.exe interface ip show address | grep 'IP Address' | grep '192.168.' | sed -r 's/^.*IP Address[ \\.:]*//') expo start",
}
↑WSL2で動かす場合は、yarn start の代わりにyarn start:wslで起動する