CODEWITHSUNDEEP
react-nativeexpo
ssuhat
ssuhat

Reputation: 7656

React Native Expo change default LAN IP

I've got virtual box installed. And when I look at the host > LAN > ip address is exp://192.168.56.1:19000.

How can I change it without disable the network? because it's my virtualbox ip and my device can't connect to it.

Thanks

Upvotes: 42

Views: 73456

Answers (17)

yash seth
yash seth

Reputation: 1

I recently encountered the same issue and found an effective solution. You can resolve it by setting the React Native packager hostname to your local IP address. Simply run the following command in your VSCode PowerShell terminal:

Set-Item env:REACT_NATIVE_PACKAGER_HOSTNAME "your_ip_address"; npx expo start

Make sure to replace "your_ip_address" with your actual IP address. This approach worked wonders for me!

Upvotes: 0

Mayyar
Mayyar

Reputation: 9

I solved the same issue with the command setx /M REACT_NATIVE_PACKAGER_HOST, it's mentioned above, but now vscode is bugged at the ip I changed it to, I tried the same command again, tried changing it manually from environment variable in the system without luck, tried restarting vscode and pc too, but still vscode it's still stuck on the same previous ip, did a lot of searching and didn't find anyone with the same issue.

Upvotes: 0

Imad_k
Imad_k

Reputation: 11

if the above solutions don't work for you, remove the .expo directory and try again.

Upvotes: 0

Anton Layla
Anton Layla

Reputation: 21

For me, something completely different worked under Windows. My pc has multiple network interfaces and the LAN URL points to a different one than that the mobile device can connect to.

This was quickly solved by deactivating all unnecessary network adapters.

(Setting the REACT_NATIVE_PACKAGER_HOSTNAME environment variable did not work for me.) And of course I was on the private network and had disabled the firewall for it until I configured it.

Alternatively, to avoid having to deactivate a network adapter, you can also adjust the metrics or priority of the adapters like this:

  1. goto Control Panel > Network and Internet > Network Connections
  2. right click the desired connection (Higher Priority Connection)
  3. click Properties > Internet Protocol Version 4
  4. click Properties > Advanced
  5. Uncheck 'Automatic Metric
  6. enter 10 in 'Interface Metric
  7. Click OK

Upvotes: 0

Rahul Reddy
Rahul Reddy

Reputation: 11

click 'npm start', open the browser where your application is running, and on the bottom left corner, you will find the QR code.

Above the QR code, three options are displayed saying 'Connection: Tunnel | LAN | Local' which is defaulted to 'LAN'. Just change it to 'Local'.

Your application will be up and running.

Upvotes: 0

Imhotep
Imhotep

Reputation: 85

If you're still having this problem, try switching to tunnel connection. It'll install @expo/ngrok@ and then you can scan the qRcode. Its what I did and the connection worked without having to change the IP address

Upvotes: 1

farouk
farouk

Reputation: 1

REACT_NATIVE_PACKAGER_HOSTNAME environment variable is ment for react DevTools. For EXPO, you have to set EXPO_DEVTOOLS_LISTEN_ADDRESS environment variable. Here is the weird function that determines the hostname :

function devtoolsGraphQLHost() {
    if (process.env.EXPO_DEVTOOLS_LISTEN_ADDRESS && process.env.REACT_NATIVE_PACKAGER_HOSTNAME) {
        return process.env.REACT_NATIVE_PACKAGER_HOSTNAME.trim();
    }
    else if (process.env.EXPO_DEVTOOLS_LISTEN_ADDRESS) {
        return process.env.EXPO_DEVTOOLS_LISTEN_ADDRESS;
    }
    return 'localhost';
}

Upvotes: 0

HD2020
HD2020

Reputation: 23

Sharing my experience using EXPO with Cloud 9 and AWS Amplify. Similar with you, the QR code gives exp://localhost:19000

As the Security Group has been configured to provide public access, I regenerate the QR code to have it accessible from public IP address of exp://X.X.X.X:19000, this can be scanned from IOS devices to EXPO.

Upvotes: 0

Hao Guo
Hao Guo

Reputation: 1

My problem solved by reinstall expo client on ios simulator.
I was used expo v37 before but got this problem on v38, the problem was expo client not have expo sdk 38.

Upvotes: 0

thargenediad
thargenediad

Reputation: 395

On the Windows Subsystem for Linux (Ubuntu 18.04.1 LTS "Bionic"), I had to use the export command:

export REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.76.

Upvotes: 3

Kiran Maniya
Kiran Maniya

Reputation: 8979

Open CMD from your Project Directory and Run Command as set REACT_NATIVE_PACKAGER_HOSTNAME=192.168.0.12. Replace the ip with your own LAN ip address. The Command set is used to set the Environment variable locally, without defining it into Environment Variables.

Upvotes: 2

Mauricio Cortazar
Mauricio Cortazar

Reputation: 4213

In windows you can use:

set REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.59

set is only used for one session. If you always wanna use the same ip after reboot you can use:

setx /M REACT_NATIVE_PACKAGER_HOSTNAME 192.168.1.59

Upvotes: 15

Donnie zheng
Donnie zheng

Reputation: 31

check your pc whether install virtualbox , disable VirtualBox Host-Only Network

go to win pc: Control Panel\Network and Internet\Network Connections

run again command expo start is ok

Upvotes: 3

0xori
0xori

Reputation: 585

If you have "ubuntu in windows" configured you can automate the process and run:

for /F "usebackq delims=" %A in (`ipconfig  ^| grep -A4 'Wireless LAN adapter WiFi' ^| tail -1 ^| awk '{print $NF}'`) do set REACT_NATIVE_PACKAGER_HOSTNAME=%A

Upvotes: 0

Nah
Nah

Reputation: 1768

I have similar kind of problem (with may a slight difference), but the solution doesn't work for me. Finally I tried Expo CLI tool which worked great for me and is also recommended by Expo team.

My detailed question (may help someone to resolve similar problem):

Expo LAN configuration doesn't work for New ReactNative Project

Upvotes: 1

pdwjun
pdwjun

Reputation: 133

Even after you set the custom ip, you still cannot connect the virtual box.

You need to set a port forward for the virtual mechine at networking setting page.

Just use the real host mechine ip for the app Expo.

 REACT_NATIVE_PACKAGER_HOSTNAME='real host mechine ip' npm start

Upvotes: 7

dikaiosune
dikaiosune

Reputation: 1105

You can specify the REACT_NATIVE_PACKAGER_HOSTNAME environment variable to use the correct IP address.

If you're using XDE, then make sure to launch it from your project directory with xde . after you've installed the command line tools.

Upvotes: 54

Related Questions