live server右键无选项或不刷新，主因是插件未激活或文件不满足工作区+html+已保存条件；须通过“文件→打开文件夹”建立工作区，确保右下角显示go live，且仅对已保存的.html文件生效。
Live Server 插件装不上、右键没选项、保存不刷新——这些问题基本都出在「没激活」或「文件结构不满足启动条件」上，而不是插件本身坏了。
为什么右键没有 Open with Live Server
Live Server 不会对孤立的 HTML 文件显示右键菜单，它只响应「处于工作区中的 HTML 文件」。也就是说，你不能直接双击一个 index.html 拖进 VSCode 就用；必须先打开一个文件夹（即工作区），再把 HTML 放进去。
- 确认你已通过「文件 → 打开文件夹」或直接拖拽整个文件夹到 VSCode 窗口
- 检查左下角状态栏是否出现
Go Live按钮：没有说明插件未激活，尝试禁用再启用一次插件 - 右键菜单只对
.html、.htm文件生效，对.txt或未保存的临时文件无效 - 如果仍不出现，按
Ctrl+Shift+P输入Live Server: Start手动触发，看是否报错
保存后浏览器不自动刷新的常见原因
Live Server 的自动刷新依赖文件系统监听，但默认只监听工作区根目录下的变更。如果你的 HTML 在子目录里（比如 src/pages/index.html），而 CSS/JS 在 dist/ 下，就可能漏掉变化。
- 确保所有被引用的资源路径是相对的，且能被浏览器正确加载（打开开发者工具 Network 面板看
404） - 修改
index.html本身并保存，一定触发刷新；但改js/script.js后不刷，大概率是路径写错了 - Live Server 不支持热模块替换（HMR），它只做整页
reload，不是 React/Vue 那种局部更新 - 某些杀毒软件或 Windows Defender 会拦截文件监听，可临时关闭测试
怎么改端口、指定入口文件或关掉自动打开浏览器
这些配置都写在 VSCode 的 settings.json 里，用户级或工作区级均可，后者优先级更高。
- 打开设置：
Ctrl+,→ 搜索live server settings→ 点击右上角「在 settings.json 中编辑」 - 常用配置项示例：
{
"liveServer.settings.port": 3000,
"liveServer.settings.root": "./src",
"liveServer.settings.file": "main.html",
"liveServer.settings.NoBrowser": true
}
-
"liveServer.settings.NoBrowser": true关闭自动弹浏览器，适合配合手机调试或已有标签页复用 - 改端口是为了避开被占用（比如 Python 的
http.server常占8000），5500是默认值，但不是唯一选择
Live Server 启动后图片加载不出来怎么办
这是最常被忽略的路径问题：Live Server 启动的是 HTTP 服务，所有资源路径必须符合浏览器同源规则，不能用绝对路径（如 C:/xxx/image.png）或错误的相对路径（如漏掉 ./ 或多了一层 ../）。
- 检查
<img src="...">中的路径是否相对于当前 HTML 文件位置正确 - 打开浏览器开发者工具 → Network 标签页，看图片请求是否返回
404 - Live Server 默认以工作区根目录为 Web 根路径，不是 HTML 所在目录；若 HTML 在子目录，又用了
./images/xxx.png，那实际找的是根目录/images/xxx.png - 可通过
"liveServer.settings.root": "./src"调整 Web 根路径来适配项目结构
复杂点在于：Live Server 不校验 HTML 结构，也不模拟本地文件协议（file://）的宽松行为，它严格走 HTTP 规则。路径写错、跨目录引用、大小写不一致（尤其在 Linux/macOS 上）——这些在双击打开时可能“碰巧”能显示，但在 Live Server 下必然失败。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
