Live Server插件解决本地静态HTML/CSS/JS文件保存后需手动刷新浏览器的问题，通过自动监听并刷新对应页面，但仅限不依赖后端的纯前端文件，对React/Vue项目或API调用无效。
Live Server 插件能解决什么问题
它让 VS Code 保存文件时自动刷新浏览器，但只对本地静态文件有效——比如 index.html、style.css、script.js 这类不依赖后端服务的页面。如果你在写 React/Vue 单页应用或调用 fetch('/api')，它帮不上忙，因为没启动对应的服务端。
安装和启动必须做对这三步
- 在 VS Code 扩展市场搜
Live Server，装官方那个（作者是 Ritwick Dey）
- 右键点击你的
index.html 文件 → 选 Open with Live Server，别点错成 Open in Default Browser
- 确认地址栏是
http://127.0.0.1:5500/ 或类似本地端口，不是 file:/// 开头——后者不会自动刷新
改了 JS/CSS 但浏览器没更新？先看这几个地方
Live Server，装官方那个（作者是 Ritwick Dey）index.html 文件 → 选 Open with Live Server，别点错成 Open in Default Browser
http://127.0.0.1:5500/ 或类似本地端口，不是 file:/// 开头——后者不会自动刷新常见现象是 HTML 刷新了，但脚本逻辑没变，或者样式还是旧的。原因往往不是 Live Server 失效，而是缓存或路径问题：
- 浏览器按
Ctrl+Shift+R（Windows/Linux）或Cmd+Shift+R（macOS）强制重载，绕过缓存 - 检查
<script src="main.js"></script>中的路径是否相对于index.html当前位置，不是 VS Code 工作区根目录 - 如果用了
type="module"，确保服务器返回的 MIME 类型正确（Live Server 默认支持，但旧版本可能不识别.mjs）
为什么改完代码总要手动点“刷新”
根本原因是 Live Server 只监听你当前打开的 HTML 文件及其同级资源，不会递归扫描整个文件夹。几个典型漏掉的情况：
- 你在
/src/index.html启动服务，但修改的是/src/js/app.js——只要路径引用正确，它会生效；但如果改的是/lib/utils.js且没被引入，自然没反应 - 用了构建工具（如 Vite、Webpack），它们自带热更新，此时再开 Live Server 会冲突，端口占着、刷新逻辑打架
- VS Code 设置里关掉了
files.autoSave，保存动作没触发，Live Server 就收不到变更信号
最常被忽略的一点：Live Server 不监听 CSS 预处理器（如 style.scss）或 TypeScript 源文件，它只管最终被 HTML 引入的那些已编译产物。
