浏览器双击打开html常因file://协议安全限制导致白屏，应改用live server等http服务；常见错误包括err_file_not_found、cors及路径解析失败，需检查network面板、相对路径和文件存在性。
直接双击就能打开，但只要页面里用了 fetch、import、XMLHttpRequest 或者依赖相对路径加载 JS/CSS/图片，大概率会白屏或报错——这不是你文件没打开，是浏览器主动拦住了。
双击打开为什么有时不工作
Chrome 和 Edge 在 file:// 协议下默认禁用：localStorage（部分版本）、fetch('./data.json')、Service Worker、history.pushState；Firefox 虽稍宽松，但同样拒绝同目录读取 .json 文件。
- 错误现象常见为：
net::ERR_FILE_NOT_FOUND（其实是被策略拦截，不是真找不到）或控制台空白无报错 - 路径写成
/script.js会去系统根目录找，不是项目根目录——file://下的“根”是磁盘根，不是你项目文件夹 - 别试
--allow-file-access-from-files，Chrome 已废弃该参数，且新版启动直接忽略
本地服务器才是真实开发起点
哪怕只是改一行 JS 并想立刻看效果，也建议用 HTTP 服务启动，否则你会反复怀疑代码逻辑，其实问题出在协议层。
-
npx serve -s .：需已装 Node，启动后访问http://localhost:5000 -
python3 -m http.server 8000：Python 3 自带，无需额外安装，访问http://localhost:8000 - VS Code 用户直接装
Live Server插件，右键 HTML 文件选Open with Live Server，自动刷新+正确路径解析
调试时怎么确认是不是路径问题
浏览器开发者工具的 Network 面板比控制台更能暴露真相——看请求 URL 是不是拼错了，状态码是不是 failed 而非 404。
- 检查所有
src和href值：用./xxx.js，不用xxx.js或/xxx.js - 确认文件确实存在：终端执行
ls -la（macOS/Linux）或dir（Windows），核对大小写和扩展名（DATA.JSON≠data.json） - 如果引用的是
./images/logo.png，确保该路径下真有images/子目录，而不是放在同级
真正容易被跳过的点是：把“能渲染出静态文字”当成“页面跑通了”。只要涉及任何动态加载、模块化或路由，file:// 就不是开发环境，而是陷阱入口。用 http://localhost 启动，是底线，不是可选项。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
