I use an extension called Live Server in Visual Studio Code. When I run live, the browser opens and the url is http://127.0.0.1:5500/index.html. Why can't I open this url on my phone's browser to see the live site on the phone. Is there a way to do this (Live reload on phone and browser)?
Note: I also develop using ionic and when I ionic serve I can see it on browser and when I open the ionic dev app (not ionic view!), I can see the live app on the phone. I can view it on multiple devices with the condition of all devices being in the same network which I am fine with.
127.0.0.1 is a special-purpose IPv4 address reserved for loopback purposes. That is, this IP refers to your computer itself.
By entering http://127.0.0.1:5500/index.html in your browser, you're requesting web page within your computer.
In normal case, your computer will be in a NAT network (under same wi-fi AP for instance), and you'll be assigned with a virtual IP. Normally it's 192.168.x.x.
You may enter the following command in your command prompt to see your IP address.
ipconfig
If you're using Mac or Linux, use this instead.
ifconfig
As a result, under your network interface card, you'll get your IP Address.
If the IP address belongs to virtual IP, then you may access it with your phone using
http://< Your IP Address >:5500/index.html
If it's not virtual IP, it is Public IP. Then, you'll have to configure appropriate Firewall settings under this circumstance.
Hope this will help.