vs code 本身不渲染 html，必须依赖外部浏览器或本地 http 服务；live server 是唯一靠谱的实时预览方案，启动后通过 http://localhost:5500 提供热更新，规避 file:// 协议限制，确保 js、css、fetch 等正常运行。
VS Code 本身不渲染 HTML，所谓“预览”必须依赖外部浏览器或本地服务——直接双击打开或右键“在浏览器中打开”，走的是 file:// 协议，JS、CSS、fetch、import 全部可能失效。真要验证效果，得用 HTTP 服务。
Live Server 是唯一靠谱的实时预览方案
它不是“可选插件”，而是开发闭环的基础设施。启动后监听文件变化，保存即刷新，且所有资源走 http://localhost:5500（或自动 fallback 端口），完全规避 file:// 限制。
- 只装作者为 Ritwick Dey 的那个
Live Server（扩展 ID：ritwickdey.LiveServer），别选同名低下载量版本 - 右键 HTML 文件 →
Open with Live Server，或点底部状态栏Go Live按钮 - 首次启动后，浏览器地址栏显示类似
http://127.0.0.1:5500/index.html，这才是正确路径 - 改完代码保存，刷新延迟通常在 100–300ms，不依赖手动 F5
- 如果页面空白或资源 404，先检查浏览器地址是不是以
file:///开头——那是错的，必须是http://
Open in Browser 插件只适合静态结构快看
它本质就是帮你调用系统默认浏览器打开当前 HTML 文件，路径仍是 file:///，所以仅适用于：没 JS、没外部 CSS、没 fetch、没模块导入的纯骨架页。
Comet AI 浏览器
下载
下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
- 安装插件后，右键编辑器标签页或资源管理器文件 →
Open in Default Browser - 常见报错：
net::ERR_FILE_NOT_FOUND、Failed to load module script、Cross origin requests are only supported for protocol schemes - 适合场景：临时检查 HTML 结构、验证标签嵌套、快速比对两个静态文件差异
- 不适合场景：任何含交互逻辑、AJAX 请求、ES 模块、相对路径跨级引用（如
../data/config.json）的页面
Browser Preview 插件不能替代 Live Server
它把 Chromium 渲染引擎嵌进 VS Code 编辑器里，看着像“内置预览”，但底层仍用 file:// 加载，不启动 HTTP 服务，所以无法执行真实 fetch、不支持 service worker、模块加载受限，且无热重载。
- 适合调试 UI 布局、响应式断点、CSS 动画帧，但 JS 控制台日志可能不全，断点调试需额外配
Debugger for Chrome - 若项目依赖本地 API 或 WebSocket，
Browser Preview打开的页面大概率连不上 - 它和
Live Server不冲突，可共存，但不要误以为开了 Browser Preview 就不用起本地服务了
最常被忽略的点：公司内网、防火墙、代理软件会拦截 localhost，此时 Live Server 终端日志照常显示 “Starting server on http://127.0.0.1:5500”，但浏览器打不开——这不是插件问题，得查本地网络策略，而不是反复重装或换端口。
