It depends what you're trying to achieve. If you're writing plain HTML & CSS you can try this extension out: https://marketplace.visualstudio.com/items?itemName=hdg.live-html-previewer
It opens a preview of the HTML document right inside of VS Code.
But if you're viewing your website through a browser you'll have to use a tool like ngrok (which is a CLI tool). This will create a publicly accessible URL for you that you can share with the people you're working with. This only works if you're already serving your website which you can use the "View in Browser" extensions you've used as long as they actually host it on your localhost.
For example a lot of extensions will open up a browser tab at localhost:3000. Make sure that when you run ngrok you set the port to be the same.
This will let you and the people you're collaborating with see the same preview of the website.
There's also a VS Code extension for ngrok too that you can try out: https://marketplace.visualstudio.com/items?itemName=philnash.ngrok-for-vscode
Answer from Dan Fletcher on Stack OverflowHello! My friend and I started using vscode live share together to code a website and everything is going good. The only issue is that the host who made the collaboration session shared it with me is the only one who can preview the changes in the browser. I was wondering if there is any way I can do the same on my computer without always requesting the host to show me the changes in the preview.
Videos
And I feel discouraged. I thought this project was finally ready to share with people but I’m not happy with this version.
In live preview things were super responsive and fluid. GitHub pages version is janky and glitches out.
Also, the size and placement of elements is different than what I saw with live preview.
This is my first “real” web project so I don’t know if this is a common experience.
Can I trust Live Preview?
Should I try hosting on a different domain?
For Windows - Open your Default Browser - Tested on VS Code v 1.1.0
Answer to both opening a specific file (name is hard-coded) OR opening ANY other file.
Steps:
Use ctrl + shift + p (or F1) to open the Command Palette.
Type in
Tasks: Configure Taskor on older versionsConfigure Task Runner. Selecting it will open the tasks.json file. Delete the script displayed and replace it by the following:{ "version": "0.1.0", "command": "explorer", "windows": { "command": "explorer.exe" }, "args": ["test.html"] }Remember to change the "args" section of the tasks.json file to the name of your file. This will always open that specific file when you hit F5.
You may also set the this to open whichever file you have open at the time by using
["${file}"]as the value for "args". Note that the$goes outside the{...}, so["{$file}"]is incorrect.Save the file.
Switch back to your html file (in this example it's "text.html"), and press ctrl + shift + b to view your page in your Web Browser.

VS Code has a Live Server Extension that supports one click launch from status bar.
Some of the features:
- One Click Launch from Status Bar
- Live Reload
- Support for Chrome Debugging Attachment
