How to open VS Code Live Server Extension web page on mobile?

How to see live server extension page on mobile?

Hello guys, today I am going to write about a very productive topic, if you have started learning as Web developer and using one of our favorite Code editors as a VS Code.

So, if you have ever written HTML code and wanted to see HTML magic on your browser you have used Live Server extension once in a life…

And this extension makes a frontend developer way more productive. But many developers don’t know how to see the same webpage on mobile because todays web world follows mobile first approach for website development.

So, by default Live server only enable server for your PC not for your mobile. But there is an inside setting that let you enable this, and you can see the same page on mobile too.

Prerequisite: Both PC and Mobile on same network.

Let's Start:

Step 1:

Just enable USE LOCAL IP inside setting.json file of VS Code.

"liveServer.settings.useLocalIp": true

How can you do this?

Follow Steps:

Click on settings and open settings.

Click on this little file icon to access settings.json file.

And you’ll have setting json file and just paste this line at end and you're done.

"liveServer.settings.useLocalIp": true

Now next time when you use live server it will open with your local IP and you can access this page by typing same address in your mobile browser.

Example Video check on my YouTube channel:

Thank you for your time. See you next time with new interesting topic. Take care.

Ways to connect with me! | YouTube, LinkedIn, Twitter| Linktree