用Open in Browser插件右键HTML文件选择“Open in Default Browser”可直接打开；若需自动刷新和HTTP服务，应使用Live Server插件并右键选择“Open with Live Server”。
vscode 怎么把 HTML 文件直接打开到浏览器
VS Code 本身不运行代码，它只是编辑器；所谓“运行到浏览器”，本质是让浏览器打开本地 HTML 文件。最可靠的方式是用插件或手动右键——别信某些教程说的“按 F5 就能跑”，那默认调的是调试器，不是开浏览器。
- 装
Open in Browser插件（微软官方维护，轻量无广告），装完右键 HTML 文件 → “Open in Default Browser” - 不用插件的话，右键文件 → “Reveal in Explorer” → 双击 HTML 文件，靠系统关联打开（但可能不是你想要的浏览器）
- 如果右键没选项，检查文件后缀是不是真为
.html（不是.txt或没后缀），VS Code 底部状态栏会显示当前语言模式
为什么 Live Server 插件更常用
单纯打开一次 HTML 没法自动刷新，改了代码还得手动刷新页面。Live Server 解决的就是这个痛点：启动一个本地 HTTP 服务，保存即刷新，还支持热重载（部分场景）。
- 装
Live Server插件（作者是 Ritwick Dey），右键 HTML 文件 → “Open with Live Server” - 它默认用
http://127.0.0.1:5500/xxx.html启动，不是file://协议，所以能正常加载fetch、import、相对路径资源等 - 注意：如果项目里有
index.html，它会自动作为入口；没有的话，得手动点右键选具体文件 - 端口冲突时会自动换端口，但如果你在脚本里硬编码了
5500，就可能连不上——别写死端口
遇到 “Cannot GET /xxx” 错误怎么办
这是 Live Server 常见报错，典型表现是浏览器显示白页+这行文字，不是代码错了，而是路径或服务没对上。
- 确认你右键的是项目根目录下的 HTML 文件，而不是子文件夹里的——Live Server 默认以当前文件所在目录为服务器根路径
- 如果 HTML 里引用了
./js/app.js，但app.js实际在src/js/下，就会 404；检查控制台 Network 标签页看哪个请求失败 - 关闭其他占着
5500端口的程序（比如另一个 Live Server、Python 的http.server），或在插件设置里改默认端口为liveServer.settings.port - 别在 VS Code 内置终端里手动跑
npx http-server后又点 Live Server——两个服务抢端口，后者大概率失败
JavaScript 代码没反应？先看控制台和协议
很多新手以为“开了浏览器就等于能跑 JS”，结果 console.log 不打印、document.getElementById 返回 null，其实跟 VS Code 关系不大，是环境或执行时机问题。
- 用 Live Server 打开（
http://）而不是双击打开（file://），否则 Chrome 会拦截fetch和模块导入 -
script标签加defer或放在
