The VSCode team has developed a Live Server extension with a lot of integrations. See v1.58 pre-release notes:
Live Preview
We have developed a Live Preview extension, which hosts a local server for web development previewing!
It features an in-editor browser preview, live preview refreshing (on file change or on save), multi-root support, and more!
The extension also has a
Live Previewtask, which runs a persistent server and allows you to view server traffic and its associated files.
To learn more about what it can do, view it in the marketplace or check out its repo.
Answer from Mark on Stack Overflow
The VSCode team has developed a Live Server extension with a lot of integrations. See v1.58 pre-release notes:
Live Preview
We have developed a Live Preview extension, which hosts a local server for web development previewing!
It features an in-editor browser preview, live preview refreshing (on file change or on save), multi-root support, and more!
The extension also has a
Live Previewtask, which runs a persistent server and allows you to view server traffic and its associated files.
To learn more about what it can do, view it in the marketplace or check out its repo.
There are tons of different vscode extensions for browser previews. The one i'm using is Browser Preview.
To view .php files, you need a server, like Apache.
XAMPP is an all in one solution which offers MySQL, Apache and some other tools: https://www.apachefriends.org/index.html
Videos
Hello @Paula Henderson,
Thank you for taking time to post this issue in Microsoft Q&A forum.
As Visual Studio(VS IDE) and Visual Studio Code(VS Code) are two different products, their extensions are usually different. May I firstly confirm, if you are using this extension: Live Preview? If so, it’s an extension for VS Code, not for VS IDE.
If you are using VS Code, the preview option should be there when you right-click one of the web pages. For example, I tested with a single .html file, see following screenshot:
If you are using VS IDE, then maybe you mean the integrated Web Live Preview feature? If so, you may need to use it in ASP .NET Web applications. You can right-click one of the web pages, select "View in Browser" or "Browse With…"(choose the Internal Web Browser or other web browsers, click Browse button) to live preview this web page.
Don't forget to enable web live preview feature and restart VS(Tools > Options > Web Forms Designer > General >Web Forms designer (requires restart) > Web Live Preview).
For example, tested with an ASP .NET Web application(.NET Framework, Web Forms):
Above is for VS 2022, if you are using VS 2019, you should follow the guidance here to enable it:
Web Live Preview (Preview)
If you still fail to see the corresponding options, please kindly share us some screenshots to confirm the issue and check further.
Please don’t hesitate to contact us.
Sincerely,
Tianyu
If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.
Thank you. My extension was wrong. I actually had a different file I created not coffee ext but it was apparently wrong ext too because it did not have preview. It's all in the ext. Thanks so much for your help
I been recently trying to see my website I’m building in the browser I look for vscode extensions and none were available or just simply was not working
I have recently discovered vscode.dev and it is amazing, particularly for introducing html/js coding to my students who are using locked down chromebooks. However it seems none of the extensions for previewing html/js etc are available for vscode web. For now, I have worked around it by editing files locally and opening those separately in the browser and refreshing on change. But wondering if there is a better way. In particular, it would be nice to be able to use the open github feature and preview changes without committing to the repo. TIA!