必须选 Live Server，因为它起真实 HTTP 服务（如 http://localhost:5500），绕过浏览器本地文件跨域限制，使 CSS import、fetch、Service Worker 等正常工作；其他插件如 live preview 不监听文件变化，live reload 需额外配置构建工具。
直接用 Live Server 插件，别试其他名字相近的——live reload、live preview 都不满足“改完就刷”的需求。
为什么必须选 Live Server 而不是别的插件？
它不是简单打开一个 file:// 页面，而是起一个真实的 HTTP 服务（比如 http://localhost:5500），能绕过浏览器对本地文件的跨域限制，CSS import、fetch 请求、Service Worker 等功能才真正可用。
常见错误现象：
- 装了
live preview，改完 HTML 保存没反应 → 它压根不监听文件变化，也不起服务器 - 装了
live reload，但页面不刷新 → 它需要你额外配 Gulp/Webpack，单独装插件无效 - 右键没出现
Open with Live Server→ 插件没装对，或装的是同名但作者不是Ritwick Dey的非官方版本
Live Server 启动后浏览器没自动打开？检查这三处
默认行为是自动开浏览器，但经常被以下设置干扰：
-
"liveServer.settings.NoBrowser": true—— 如果你在.vscode/settings.json里手动加了这行，删掉就行 - 系统默认浏览器被锁死为 Edge 或 Safari，而你想要 Chrome → 在设置里加：
"liveServer.settings.CustomBrowser": "chrome" - 端口被占用（比如另一个项目正在用
5500）→ 改成："liveServer.settings.port": 8080，再重启插件
验证是否生效：启动后看 VSCode 底部状态栏有没有蓝色 Go Live 按钮亮起，且旁边显示端口号（如 5500）。
想保存即刷新，但又不想每敲一个字都存？配 files.autoSave
Live Server 只响应“保存动作”，不是“内容变化”。如果你关了自动保存，就得手动按 Ctrl+S 才能触发刷新——这反而比不用插件还麻烦。
推荐配置（写在工作区 .vscode/settings.json 中）：
{
"files.autoSave": "afterDelay",
"files.autoSaveDelay": 500
}
这样编辑时停顿半秒就自动存，Live Server 紧接着刷新，手感接近实时。注意别设成 "onFocusChange"，切到浏览器窗口就保存，容易误触。
多个 HTML 文件时，默认打开哪个？
插件默认找 index.html；找不到就打开当前活动标签页的 HTML 文件。但如果你项目里有 src/index.html 和 demo.html 并列，右键点 demo.html 再选 Open with Live Server，它就会以 demo.html 为入口，地址变成 http://localhost:5500/demo.html。
如果你想固定入口，加这一行配置：
"liveServer.settings.file": "src/index.html"
路径是相对于项目根目录的，别写成绝对路径或带 ./ 前缀。
复杂点在于：如果同时开了两个 Live Server 实例（比如两个终端窗口各自跑了不同端口），它们互不感知，改一个文件可能只刷其中一个页面。这种情况得手动停掉旧实例——点底部状态栏的 Go Live 按钮两次，或右键选 Stop Live Server。
