live server无反应的根本原因是工作区根目录缺少index.html或文件名大小写/路径不匹配；它仅默认识别index.html或index.html，不支持home.html等其他文件名，且热重载依赖保存与浏览器缓存设置。
Live Server插件装了但点“Go Live”没反应
根本原因通常是工作区根目录里没有 index.html，或者文件名大小写/路径不匹配。Live Server默认只识别 index.html、Index.html（Windows不区分，macOS/Linux区分），其他如 home.html 或 pages/index.html 不会自动触发。
实操建议：
- 确保当前打开的文件夹里有且仅有一个
index.html（小写、无空格、无中文） - 右键点击任意HTML文件 → 选
Open with Live Server，比点状态栏按钮更可靠 - 如果项目结构是多页的，可手动在浏览器地址栏追加路径，比如
http://127.0.0.1:5500/about.html - 检查VSCode右下角状态栏是否显示
Live Server: 5500，没显示说明服务根本没启起来——此时看输出面板（Ctrl+Shift+U）里Live Server日志，常见报错是端口被占，可改配置项liveServer.settings.port
CSS修改后页面没更新，要手动刷新
Live Server本身支持热重载（Hot Reload），但只对保存后的文件生效，且依赖浏览器是否启用缓存。开发时浏览器常把CSS缓存住，导致你改了 style.css 却看不到变化。
实操建议：
- 保存CSS文件后，观察VSCode右上角是否弹出“Reloading CSS…”提示（有则说明热重载已触发）
- Chrome中打开开发者工具（
F12）→ Network 标签 → 勾选Disable cache（仅在 DevTools 打开时生效） - 检查HTML中CSS引入是否用了相对路径且拼写正确，比如
<link rel="stylesheet" href="css/style.css">，若实际路径是assets/css/style.css就会404，但Live Server不会报错，只静默失败 - 避免在CSS里用
@import多层嵌套，Live Server对深层@import的热更新支持不稳定
怎么让Live Server自动打开特定HTML文件而不是index.html
Live Server默认行为固定，不支持“首次启动就开about.html”这种逻辑。但可以通过配置绕过限制，本质是让它把整个目录当静态服务跑，再手动导航。
实操建议：
- 在VSCode设置里搜
liveServer.settings.root，设为"."（当前工作区根），确保服务范围覆盖所有子目录 - 修改
liveServer.settings.AdvanceCustomBrowserCmdLine配置项，填入类似"--new-window http://127.0.0.1:5500/login.html"（仅限Chrome，注意空格和引号） - 更稳妥的做法：不依赖自动打开，而是用快捷键
Alt+L Alt+O（Windows/Linux）或Cmd+L Cmd+O（macOS）快速打开当前活动HTML文件 - 如果必须每次进
dashboard.html，就把它重命名为index.html——简单粗暴，但最稳
本地图片路径在Live Server下显示404
路径错误是主因，尤其新手容易混淆相对路径起点。Live Server的HTTP根目录 = VSCode当前打开的文件夹，不是HTML文件所在目录。
实操建议：
- 假设你在
/project/pages/detail.html里写<img src="img/logo.png">，它会去找/project/img/logo.png，而非/project/pages/img/logo.png - 统一用以项目根为基准的路径：比如图片在
/project/assets/images/icon.jpg，就在HTML里写<img src="/assets/images/icon.jpg">（开头的/表示从服务根开始） - 不要用
file:///协议路径，Live Server走的是http://，浏览器会拦截跨协议请求 - 遇到404时，右键图片 → “在新标签页中打开图片”，看浏览器地址栏完整URL，对比文件实际位置，差哪一级补哪一级
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
