根本原因是工作区未设为项目根目录，导致Live Server无法定位资源；须通过“文件→打开文件夹”加载整个项目，右键HTML文件选择“Open with Live Server”，访问http://127.0.0.1:5500/而非file:///路径。
Live Server 插件启动后页面空白或 404
根本原因通常是工作区没设对，VS Code 不知道该把哪个文件夹当网站根目录。插件默认只认当前打开的文件夹，如果只是单独打开了一个 index.html，它找不到同级的 CSS/JS 资源，甚至可能连自身都返回 404。
- 确保在 VS Code 中通过 “文件 → 打开文件夹” 打开整个项目根目录（比如含
index.html、css/、js/的文件夹），而不是只打开单个 HTML 文件 - 右键点击
index.html→ 选择Open with Live Server，不要点顶部菜单栏的“运行”或按 F5 —— 那是调试模式，不走 Live Server - 浏览器地址栏必须是
http://127.0.0.1:5500/这类本地地址，不是file:///路径；后者会触发跨域、资源加载失败
修改端口或自动打开浏览器怎么配
Live Server 默认用 5500 端口，但冲突时会自动加 1（5501、5502…），不一定好记；自动打开浏览器也可能干扰你已有的开发流程。
- 在 VS Code 设置里搜
liveServer.settings.port，改成固定值如3000，避免每次换端口 - 关掉自动打开：搜
liveServer.settings.donotVerifyTags不相关，真正要关的是liveServer.settings.AdvanceCustomBrowserCmdLine？不对——直接改liveServer.settings.NoBrowser为true - 配置项只在用户设置或工作区设置里生效，别写进
.vscode/settings.json后忘记保存，改完要重启 VS Code 才能生效
为什么改了 HTML 页面没实时刷新
Live Server 默认监听 .html、.css、.js 文件变化，但如果你用构建工具（如 Vite、Webpack）或写了内联脚本，它就无能为力了。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 检查右下角状态栏有没有
Live Server正在运行的提示，没有说明根本没启动成功 - 确认你保存的是被监听的文件 —— 比如改了
src/index.html，但 Live Server 根目录设在dist/，那当然不刷新 - 某些编辑器插件（如 Prettier）保存时自动格式化，可能触发两次保存事件，导致 Live Server 刷新异常；可临时禁用格式化验证
- 如果用了
iframe或fetch加载本地 JSON，注意路径是否从根目录出发（/data/config.json），而非相对路径（./data/config.json）—— Live Server 的服务器上下文是根目录
和 Python 的 http.server 或其他本地服务冲突吗
会。端口被占是常见问题，但更隐蔽的是多个服务同时监听 localhost 可能引发缓存混淆或 CORS 表现不一致。
立即学习“前端免费学习笔记（深入）”；
- 终端里跑过
python3 -m http.server 5500？先Ctrl+C停掉，再启 Live Server，否则 5500 被占，Live Server 会悄悄切到 5501，而你还在刷 5500 页面 - Live Server 是 Node.js 实现的轻量服务器，不支持代理、HTTPS、自定义路由；想做接口 mock 或转发请求，得换用
json-server或msw - 它不处理
import语句里的模块路径（比如import { foo } from './utils.ts'），ESM 模块需浏览器原生支持或额外打包 —— Live Server 不是构建工具
最常被忽略的一点：Live Server 启动后，所有相对路径都以项目根目录为基准，不是以 HTML 文件所在目录。这点在嵌套子文件夹里放页面时特别容易翻车。
