Live Server是唯一支持HTTP协议、避免file://跨域和模块加载错误的方案,因其启用本地服务器而非文件路径,确保fetch、import及相对路径正常工作。
是唯一能真正跑起来、改保存就刷新、且不报
或
错误的方案。其他方式——包括右键“在浏览器中打开”、拖文件进 Chrome、甚至 VS Code 内置的
插件——全都不走 HTTP 协议,本质还是
,一碰模块加载或跨域请求就跪。
为什么“Open in Default Browser”总报错
它只是把
丢给浏览器,现代浏览器对
协议做了三重封杀:
→ 控制台直接报
→ 报
这类上层路径,在部分 Chrome 版本里直接 404,Firefox 可能侥幸通过但不可靠
Live Server 装了却没右键菜单?检查这几点
插件不是装完就自动生效,常见断点在这几个地方:
文件没保存:VS Code 不会为未保存的
文件激活上下文菜单
语言模式不是 HTML:看右下角状态栏,如果是
,点一下手动切到
后缀名不对:
或
默认不触发,得改成
工作区是远程(SSH/WSL):Live Server 默认不支持跨环境启动,本地项目必须用“打开文件夹”方式加载
端口被占、页面打不开、刷新没反应?优先查这三处
Live Server 启动失败往往不报错,只静默卡住:
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更
下载
默认端口
被占(比如另一个 VS Code 窗口、Zoom、Python 的
),它不会自动换端口——除非你把设置
改成
浏览器地址栏还是
开头 → 说明根本没走 Live Server,右键菜单点错了,或者状态栏没看到 “Live Server” 正在运行的提示
改了 CSS/JS 没更新 → 大概率是浏览器缓存,不是服务问题;按
(Win/Linux)或
(Mac)硬刷,别只点刷新按钮
Live Server 不是万能的,该换工具时就得换
它只监听文件变化并触发整页刷新,不编译、不转译、不打包:
立即学习
“
前端免费学习笔记(深入)
”;
用了
、
、
或
文件?关掉 Live Server,直接跑
—— 它自带 HMR,改一行 CSS 都不用刷新页面
想调试 API 请求?Live Server 本身不代理后端,
仍会 404,得配
或换用真实 dev server
项目根目录含中文或空格?服务可能静默失败,路径尽量用英文+下划线
真正的麻烦从来不在“怎么打开”,而在“打开之后 JS 跑不起来、资源加载失败、改了看不见效果”。这些坑几乎都藏在协议、缓存、路径和工具边界里,而不是操作步骤本身。
Live ServerfetchimportLive Previewfile://file:///path/to/index.htmlfile://fetch('./data.json')Not allowed to load local resourceFailed to load module script../css/main.css.htmlPlain TextHTMLindex.htmpage.xhtml.html5500http.serverliveServer.settings.port0file:///Ctrl+Shift+RCmd+Shift+RViteWebpackReact.vuenpm run devfetch('/api/users')proxy