React Native Expo change default LAN IP

Question

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

score 49 · Accepted Answer · answered May 02 '17 at 19:17

49

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.

answered May 02 '17 at 19:17

dikaiosune

1,055
9
7

2

Hi, I've tried set it using cmd `set REACT_NATIVE_PACKAGER_HOSTNAME='192.168.1.2'` but on my expo still showing 192.168.56.1 ip address. already tried restart the expo project. – ssuhat May 03 '17 at 05:47
7

Worked for me. I just used `export env REACT_NATIVE_PACKAGER_HOSTNAME=192.168.2.108` and got the desired result of having the expo on this ip after `npm start`. – Moreno Sep 03 '17 at 07:16
2

On Windows, it should be `set REACT_NATIVE_PACKAGER_HOSTNAME=192.168.0.105` – Felix Oct 12 '17 at 13:23
7

With powershell, `$env:REACT_NATIVE_PACKAGER_HOSTNAME = "10.1.1.175"` – Leo Lee Jun 20 '18 at 01:45
Works well, set `REACT_NATIVE_PACKAGER_HOSTNAME` with `ip`, and re open cmd(power shell). – Winner Mar 22 '19 at 14:09
Please provide more details. What file/script should be edited to add REACT_NATIVE_PACKAGER_HOSTNAME? – Vadym Apr 08 '19 at 18:04
@Vadim the following shows how to set the `PATH` environment variable. The process is the same for `REACT_NATIVE_PACKAGE_HOSTNAME`. The other comments are correct, but would set only for one session in cmd.exe or PowerShell. Doing it as per the link will do it permanently: https://www.java.com/en/download/help/path.xml – Wodin Feb 04 '20 at 08:07

score 14 · Answer 2 · answered Dec 13 '18 at 21:40

14

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

answered Dec 13 '18 at 21:40

Mauricio Cortazar

4,049
2
17
27

access to the path denied – Alexander Jun 11 '22 at 23:58
@NewUser134, run the command shell as an administrator to resolve the access denied error – HBCondo May 30 '23 at 05:42

score 6 · Answer 3 · answered Nov 22 '17 at 09:03

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

score 3 · Answer 4 · answered Nov 02 '18 at 15:37

3

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

answered Nov 02 '18 at 15:37

Donnie zheng

31
1

Hello and welcome to Stack Overflow :) Can you please explain the detailled steps for that please? Eventually with screenshots... Thanks! – benichka Nov 02 '18 at 15:58
indeed that works, the problem is when you have multiple adapters aside from virtualbox, for example another wifi card, in order to work you would have to disable it too – Mauricio Cortazar Dec 13 '18 at 21:34

score 2 · Answer 5 · answered Mar 06 '19 at 13:47

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.

score 2 · Answer 6 · answered Jul 30 '19 at 00:59

2

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.

answered Jul 30 '19 at 00:59

thargenediad

388
1
3
10

score 1 · Answer 7 · edited Jun 20 '20 at 09:12

1

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

edited Jun 20 '20 at 09:12

Community

1
1

answered Dec 25 '17 at 08:31

Nah

1,690
2
26
46

score 0 · Answer 8 · answered Oct 28 '18 at 08:03

0

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

answered Oct 28 '18 at 08:03

0xori

535
1
5
15

score 0 · Answer 9 · answered Jul 02 '20 at 03:38

0

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.

answered Jul 02 '20 at 03:38

Hao Guo

1

score 0 · Answer 10 · answered Nov 22 '20 at 03:58

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.

score 0 · Answer 11 · answered Aug 28 '21 at 22:46

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';
}

score 0 · Answer 12 · answered Sep 27 '21 at 07:39

0

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

answered Sep 27 '21 at 07:39

Imhotep

75
9

score 0 · Answer 13 · edited Oct 03 '21 at 05:52

0

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.

edited Oct 03 '21 at 05:52

Pierre.Vriens

2,117
75
29
42

answered Oct 02 '21 at 14:31

Rahul Reddy

11
1

Anton Layla · Answer 14 · 2021-12-30T22:27:24.703

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:

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

React Native Expo change default LAN IP

14 Answers14

Linked