live server 页面空白或404的主因是工作区未以文件夹打开或入口文件非index.html;静态资源404因路径以html所在目录为基准;css/js修改不自动刷新因默认仅监听html类文件;端口冲突可手动修改设置;https需换用其他工具。

Live Server插件启动后页面空白或404
常见现象是点击“Go Live”后浏览器打开 http://127.0.0.1:5500/,但显示空白页、找不到文件,或者控制台报 net::ERR_ABORTED。根本原因通常是当前工作区根目录没选对,或者入口 HTML 文件名不是 index.html。
- 确保 VSCode 的文件资源管理器里,你右键点击的文件(或当前打开的标签页)属于一个已打开的**文件夹工作区**,而不是单个文件 —— Live Server 只在文件夹根目录下起服务
- 如果主页面叫
home.html或app.html,它不会自动加载;必须手动在地址栏改成http://127.0.0.1:5500/home.html - 检查文件路径是否含中文或空格:某些旧版 Live Server 对非 ASCII 路径支持不稳定,建议用英文命名
- 插件默认端口是 5500,若被占用会自动跳到 5501,但浏览器可能还停留在旧地址,刷新前先看 VSCode 右下角状态栏提示的实际 URL
静态资源(CSS/JS)不生效或 404
页面结构出来了,但样式没加载、脚本报错,控制台显示 GET http://127.0.0.1:5500/style.css net::ERR_ABORTED 404 —— 这不是代码写错了,而是路径解析逻辑和开发服务器行为不一致导致的。
- Live Server 启动的是一个真实 HTTP 服务,所有相对路径都以**当前 HTML 文件所在目录为基准**,不是以 VSCode 工作区根目录为准
- 比如
src/index.html引用../css/main.css,那浏览器请求的就是http://127.0.0.1:5500/css/main.css,必须确保该路径在磁盘上真实存在 - 避免使用
file://协议直接双击打开 HTML:这时浏览器禁用跨域读取本地 CSS/JS,而 Live Server 是http://协议,绕过限制 - 如果用了
<base href="/>%EF%BC%8CLive%20Server%20%E4%BC%9A%E6%8C%89%E8%BF%99%E4%B8%AA%20base%20%E5%8E%BB%E8%A7%A3%E6%9E%90%E6%89%80%E6%9C%89%E7%9B%B8%E5%AF%B9%E8%B7%AF%E5%BE%84%EF%BC%8C%E5%AE%B9%E6%98%93%E5%BC%95%E5%8F%91%E6%84%8F%E5%A4%96%20404%EF%BC%8C%E8%B0%83%E8%AF%95%E6%97%B6%E5%BB%BA%E8%AE%AE%E5%85%88%E7%A7%BB%E9%99%A4 %0A
%E4%BF%AE%E6%94%B9%E4%BB%A3%E7%A0%81%E5%90%8E%E9%A1%B5%E9%9D%A2%E6%B2%A1%E8%87%AA%E5%8A%A8%E5%88%B7%E6%96%B0
%0A%E4%BF%9D%E5%AD%98%20HTML/CSS/JS%20%E5%90%8E%E6%B5%8F%E8%A7%88%E5%99%A8%E6%B2%A1%E5%8F%8D%E5%BA%94%EF%BC%8C%E9%9C%80%E8%A6%81%E6%89%8B%E5%8A%A8%20F5%20%E2%80%94%E2%80%94%20Live%20Server%20%E9%BB%98%E8%AE%A4%E5%8F%AA%E7%9B%91%E5%90%AC%20.html%E3%80%81.htm%E3%80%81.xhtml%E3%80%81.php%20%E7%AD%89%E5%90%8E%E7%BC%80%EF%BC%8C%E5%AF%B9%20.css%20%E5%92%8C%20.js%20%E7%9A%84%E6%94%B9%E5%8A%A8%E9%BB%98%E8%AE%A4**%E4%B8%8D%E8%A7%A6%E5%8F%91%E5%88%B7%E6%96%B0**%EF%BC%88%E5%8F%AA%E7%83%AD%E9%87%8D%E8%BD%BD%E9%83%A8%E5%88%86%E6%A1%86%E6%9E%B6%E6%89%8D%E6%94%AF%E6%8C%81%EF%BC%89%E3%80%82
- %0A
- VSCode%20%E8%AE%BE%E7%BD%AE%E9%87%8C%E6%90%9C%20
liveServer.settings.AdvanceCustomBrowserCmdLine%20%E4%B8%8D%E8%A6%81%E4%B9%B1%E5%A1%AB%EF%BC%8C%E9%82%A3%E6%98%AF%E7%BB%99%20Chrome%20%E8%B0%83%E8%AF%95%E7%94%A8%E7%9A%84%EF%BC%8C%E5%92%8C%E5%88%B7%E6%96%B0%E6%97%A0%E5%85%B3 %0A - %E7%9C%9F%E6%AD%A3%E8%B5%B7%E4%BD%9C%E7%94%A8%E7%9A%84%E6%98%AF%20
liveServer.settings.donotVerifyTags%20%E5%92%8C%20liveServer.settings.refreshOnEdit%EF%BC%8C%E4%BD%86%E5%90%8E%E8%80%85%E4%BB%85%E5%BD%B1%E5%93%8D%20HTML%20%E7%B1%BB%E5%9E%8B%E6%96%87%E4%BB%B6 %0A - %E6%83%B3%E8%AE%A9%20CSS/JS%20%E4%BF%AE%E6%94%B9%E4%B9%9F%E5%88%B7%E6%96%B0%EF%BC%8C%E6%9C%80%E7%A8%B3%E7%9A%84%E5%8A%9E%E6%B3%95%E6%98%AF%EF%BC%9A%E5%9C%A8%20VSCode%20%E8%AE%BE%E7%BD%AE%E4%B8%AD%E6%90%9C%E7%B4%A2%20
liveServer.settings.CustomBrowserUrl%EF%BC%8C%E7%95%99%E7%A9%BA%EF%BC%9B%E7%84%B6%E5%90%8E%E5%90%AF%E7%94%A8%20liveServer.settings.AdvanceCustomBrowserCmdLine%20%E5%B9%B6%E8%AE%BE%E4%B8%BA%20--auto-open-devtools-for-tabs%EF%BC%8C%E5%86%8D%E9%85%8D%E5%90%88%E6%B5%8F%E8%A7%88%E5%99%A8%E6%8F%92%E4%BB%B6%E5%A6%82%20%E2%80%9CRefresh%20Page%20on%20Save%E2%80%9D %0A - %E6%9B%B4%E8%BD%BB%E9%87%8F%E7%9A%84%E6%9B%BF%E4%BB%A3%E6%96%B9%E6%A1%88%EF%BC%9A%E6%94%B9%E5%AE%8C%20CSS/JS%20%E5%90%8E%E6%8C%89%E5%BF%AB%E6%8D%B7%E9%94%AE%20
Ctrl+Shift+P%20%E2%86%92%20%E8%BE%93%E5%85%A5%20Live%20Server:%20Reload%20%E6%89%8B%E5%8A%A8%E8%A7%A6%E5%8F%91%E4%B8%80%E6%AC%A1 %0A
%E7%AB%AF%E5%8F%A3%E5%86%B2%E7%AA%81%E3%80%81HTTPS%20%E6%88%96%E5%A4%9A%E9%A1%B9%E7%9B%AE%E5%B9%B6%E8%A1%8C%E9%97%AE%E9%A2%98
%0A%E5%90%AF%E5%8A%A8%E6%97%B6%E6%8A%A5%E9%94%99%20Error:%20listen%20EADDRINUSE:%20address%20already%20in%20use%20:::5500%EF%BC%8C%E6%88%96%E4%BD%A0%E6%83%B3%E5%90%8C%E6%97%B6%E9%A2%84%E8%A7%88%E4%B8%A4%E4%B8%AA%E4%B8%8D%E5%90%8C%E9%A1%B9%E7%9B%AE%EF%BC%8C%E5%8F%88%E6%88%96%E8%80%85%E9%9C%80%E8%A6%81%E6%B5%8B%E8%AF%95%20HTTPS%20%E8%A1%8C%E4%B8%BA%EF%BC%88%E6%AF%94%E5%A6%82%E8%B0%83%E7%94%A8%20navigator.geolocation%EF%BC%89%E3%80%82
- %0A
- %E7%AB%AF%E5%8F%A3%E8%A2%AB%E5%8D%A0%EF%BC%9F%E5%88%AB%E6%80%A5%E7%9D%80%E5%85%B3%E5%85%B6%E4%BB%96%E7%A8%8B%E5%BA%8F%20%E2%80%94%E2%80%94%20%E5%9C%A8%20VSCode%20%E8%AE%BE%E7%BD%AE%E9%87%8C%E6%90%9C%20
liveServer.settings.port%EF%BC%8C%E6%94%B9%E6%88%90%E6%AF%94%E5%A6%82%208080%20%E6%88%96%203000%EF%BC%8C%E9%87%8D%E5%90%AF%20Live%20Server%20%E5%8D%B3%E5%8F%AF %0A - %E4%B8%A4%E4%B8%AA%E9%A1%B9%E7%9B%AE%E4%B8%8D%E8%83%BD%E5%85%B1%E7%94%A8%E4%B8%80%E4%B8%AA%20Live%20Server%20%E5%AE%9E%E4%BE%8B%EF%BC%9A%E6%AF%8F%E4%B8%AA%E6%96%87%E4%BB%B6%E5%A4%B9%E5%B7%A5%E4%BD%9C%E5%8C%BA%E7%8B%AC%E7%AB%8B%E5%90%AF%E5%8A%A8%E8%87%AA%E5%B7%B1%E7%9A%84%E6%9C%8D%E5%8A%A1%EF%BC%8C%E7%AB%AF%E5%8F%A3%E4%BC%9A%E8%87%AA%E5%8A%A8%E9%94%99%E5%BC%80%EF%BC%885500%20%E2%86%92%205501%EF%BC%89%EF%BC%8C%E5%89%8D%E6%8F%90%E6%98%AF%E5%AE%83%E4%BB%AC%E6%98%AF%E4%B8%A4%E4%B8%AA%E4%B8%8D%E5%90%8C%E7%9A%84%20VSCode%20%E7%AA%97%E5%8F%A3%E6%88%96%E4%B8%8D%E5%90%8C%E6%96%87%E4%BB%B6%E5%A4%B9 %0A
- Live%20Server%20**%E5%8E%9F%E7%94%9F%E4%B8%8D%E6%94%AF%E6%8C%81%20HTTPS**%EF%BC%8C%E5%93%AA%E6%80%95%E9%85%8D%E7%BD%AE%E4%BA%86%E8%AF%81%E4%B9%A6%E4%B9%9F%E4%B8%8D%E4%BC%9A%E7%94%9F%E6%95%88%EF%BC%9B%E7%9C%9F%E8%A6%81%E6%B5%8B%20HTTPS%20%E7%89%B9%E6%80%A7%EF%BC%8C%E5%BE%97%E6%8D%A2%E7%94%A8%20
serve%EF%BC%88npx%20serve%20-s%EF%BC%89%E6%88%96%20http-server%EF%BC%88npx%20http-server%20-S%EF%BC%89 %0A - %E6%B3%A8%E6%84%8F%E9%98%B2%E7%81%AB%E5%A2%99%E6%88%96%E5%85%AC%E5%8F%B8%E4%BB%A3%E7%90%86%EF%BC%9A%E6%9C%89%E4%BA%9B%E4%BC%81%E4%B8%9A%E7%BD%91%E7%BB%9C%E4%BC%9A%E6%8B%A6%E6%88%AA%20localhost%20%E9%9D%9E%E6%A0%87%E5%87%86%E7%AB%AF%E5%8F%A3%EF%BC%8C%E8%A1%A8%E7%8E%B0%E4%B8%BA%E9%A1%B5%E9%9D%A2%E6%89%93%E4%B8%8D%E5%BC%80%E4%BD%86%E6%97%A0%E6%8A%A5%E9%94%99%EF%BC%8C%E6%8D%A2%E5%88%B0%208080/3000%20%E8%BF%99%E7%B1%BB%E5%B8%B8%E7%94%A8%E7%AB%AF%E5%8F%A3%E8%AF%95%E8%AF%95 %0A











