根本原因是工作区路径未选对或HTML文件未保存；须用“Open Folder”打开整个文件夹、确保文件已保存、使用英文路径，并检查资源相对路径是否正确。
Live Server插件为什么在VS Code里打不开HTML文件
根本原因通常是工作区路径没选对，或者HTML文件没保存。Live Server只会在当前打开的文件夹（即VS Code的根目录）下启动服务，如果直接双击打开单个index.html而没打开整个文件夹，它会找不到依赖或报Cannot GET /错误。
实操建议：
- 务必用
File → Open Folder…打开包含HTML文件的整个文件夹，而不是只打开单个文件 - 确保HTML文件已保存（哪怕只是Ctrl+S一下），未保存的临时文件不会被Live Server识别
- 检查文件名是否为
index.html——这是默认入口；如果不是，得手动在浏览器地址栏补路径，比如http://127.0.0.1:5500/test.html - 如果用了中文路径或含空格的文件夹名，改用英文命名，部分旧版Live Server对URL编码处理不稳
Live Server启动后页面空白或报404
这通常不是插件问题，而是资源路径写错了。Live Server走的是HTTP服务（http://127.0.0.1:5500/），所有相对路径都以该URL为基准解析，和直接双击打开file://协议行为完全不同。
常见错误现象：
立即学习“前端免费学习笔记（深入）”；
-
<img src="images/logo.png">在双击时能显示，但Live Server下404——说明images/文件夹不在项目根目录下 -
<script src="./js/main.js">报错net::ERR_ABORTED 404——检查js/main.js是否真实存在于根目录下的js/子目录中 - CSS里用
background: url(img/bg.jpg)失效——路径是相对于CSS文件位置的，不是HTML，容易误判
解决思路：打开浏览器开发者工具（F12），看Console或Network标签页里具体哪个资源返回404，再按路径逐级核对文件结构。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
怎么改Live Server的端口号或自动打开浏览器
VS Code的Live Server插件支持通过settings.json自定义行为，不需要改源码或命令行参数。
操作步骤：
- 按下
Ctrl+,打开设置 → 搜索live server→ 点击右上角“打开settings.json”图标 - 在JSON里添加以下字段（注意逗号分隔）：
"liveServer.settings.port": 3000, "liveServer.settings.donotShowInfoMsg": true, "liveServer.settings.AdvanceCustomBrowserCmdLine": "chrome --incognito"
说明：
-
"liveServer.settings.port"可设任意未被占用的端口（如3000、8080），避免和本地其他服务冲突 -
"liveServer.settings.donotShowInfoMsg"关掉每次启动时右下角的提示气泡 -
"liveServer.settings.AdvanceCustomBrowserCmdLine"指定浏览器及模式，例如Edge用msedge --inprivate
Live Server不刷新、修改HTML后页面没变化
绝大多数情况是浏览器缓存导致的假象，Live Server本身监听文件变更并自动触发刷新是可靠的。
排查顺序：
- 先强制刷新页面（
Ctrl+F5或Cmd+Shift+R），排除缓存干扰 - 检查VS Code右下角状态栏是否显示
Live Server: http://127.0.0.1:5500且为绿色——红色表示服务已崩 - 确认修改的是正在被服务的HTML文件，而不是同名但位于其他文件夹里的副本
- 如果用了Webpack/Vite等构建工具，别和Live Server混用——它们自带服务器，重复起服务反而互相干扰
真正难搞的是某些IDE远程开发场景（如SSH到Linux），Live Server默认不监听远程文件系统事件，这时得配合chokidar或换用browser-sync这类更底层的工具。
