Previewing React app on mobile when running from Chromebook Linux

Question

I'm running a React app from Linux on Chrome OS (Crostini), and looking to test it on a mobile device on my network. When I run npm start, I see the following:

Compiled successfully!

You can now view client in the browser.

  http://localhost:3000

Note that the development build is not optimized.
To create a production build, use npm run build.

There's no On Your Network: http://172.xx.xx.xxx:3000 as in this answer to How to make React app preview on mobile?.

Here's what sudo ifconfig shows (I replaced all addresses with x#):

(base) mghenis@penguin:~$ sudo ifconfig                                                                                                                   [9/145]
br-0a8909a8855f: flags=4099<UP,BROADCAST,MULTICAST>  mtu 1500
        inet x1  netmask x2  broadcast x3
        ether x4  txqueuelen 0  (Ethernet)
        RX packets 0  bytes 0 (0.0 B)              
        RX errors 0  dropped 0  overruns 0  frame 0
        TX packets 0  bytes 0 (0.0 B)                             
        TX errors 0  dropped 0 overruns 0  carrier 0  collisions 0
                                       
br-e46c1c011645: flags=4099<UP,BROADCAST,MULTICAST>  mtu 1500
        inet x5  netmask x6  broadcast x7
        ether x8  txqueuelen 0  (Ethernet)
        RX packets 0  bytes 0 (0.0 B)
        RX errors 0  dropped 0  overruns 0  frame 0
        TX packets 0  bytes 0 (0.0 B)
        TX errors 0  dropped 0 overruns 0  carrier 0  collisions 0

docker0: flags=4099<UP,BROADCAST,MULTICAST>  mtu 1500
        inet x9  netmask x10  broadcast x11
        ether x12  txqueuelen 0  (Ethernet)
        RX packets 0  bytes 0 (0.0 B)
        RX errors 0  dropped 0  overruns 0  frame 0
        TX packets 0  bytes 0 (0.0 B)
        TX errors 0  dropped 0 overruns 0  carrier 0  collisions 0

eth0: flags=4163<UP,BROADCAST,RUNNING,MULTICAST>  mtu 1500
        inet x13  netmask x14  broadcast x15
        inet6 x16  prefixlen 64  scopeid 0x20<link>
        ether x17  txqueuelen 1000  (Ethernet)
        RX packets 21373  bytes 9017414 (8.5 MiB)
        RX errors 0  dropped 0  overruns 0  frame 0
        TX packets 883  bytes 100673 (98.3 KiB)
        TX errors 0  dropped 0 overruns 0  carrier 0  collisions 0

lo: flags=73<UP,LOOPBACK,RUNNING>  mtu 65536
        inet x18  netmask x19
        inet6 ::1  prefixlen 128  scopeid 0x10<host>
        loop  txqueuelen 1000  (Local Loopback)
        RX packets 554  bytes 3849374 (3.6 MiB)
        RX errors 0  dropped 0  overruns 0  frame 0
        TX packets 554  bytes 3849374 (3.6 MiB)
        TX errors 0  dropped 0 overruns 0  carrier 0  collisions 0

I tried most of those :3000 on my phone, none worked.

I also tried the address from the Network settings dialog :3000, that also didn't work.

echo $HOST returns localhost, but if I set export HOST=192.168.68.113 then npm start shows:

Could not find an open port at 192.168.68.113.

Is it possible?

Previewing React app on mobile when running from Chromebook Linux

0 Answers0