VS Code 内置浏览器打开网页

0 阅读1分钟

VS Code 内置浏览器打开网页

VS Code 可以直接在编辑器里打开网页,不一定要切到外部浏览器。

这个功能叫 Integrated Browser,也就是“内置浏览器”。我们可以在 VS Code 里直接打开网页,或者预览本地 HTML 文件。

1.jpg

打开一个 URL

按下:

Cmd + Shift + P

输入:

Browser: Open Integrated Browser

然后填入你想打开的地址:

https://example.com

VS Code 就会在编辑器里打开这个网页。

如果你在开发前端项目,也可以输入本地服务地址:

http://localhost:5173

这样就能一边写代码,一边在 VS Code 里看页面。

打开 HTML 文件

本地 HTML 文件也可以直接预览。

比如 index.html,在文件上右键,选择:

Open in Integrated Browser

页面就会在 VS Code 内部打开。

修改 HTML 后,预览也会跟着更新,适合写一些简单页面或临时 demo。

和 Live Server 的区别

Integrated Browser 负责“在 VS Code 里打开网页”。

Live Server 或 Live Preview 负责“启动本地服务并自动刷新”。

所以简单预览 HTML,用 Integrated Browser 就够了;如果是完整前端项目,可以先运行 pnpm dev,再把本地地址放到 Integrated Browser 里打开。