双击html文件可直接打开，但浏览器因安全策略限制file://协议下的fetch、localstorage等功能；需用本地服务器（如npx serve、python http.server或vs code live server）调试。
直接双击就能打开，但浏览器可能因安全策略拒绝加载本地资源（比如 fetch 请求 file:// 下的 JSON 或图片），这不是文件打不开，而是功能被限制了。
用浏览器双击打开是最简单的方法，但有兼容性差异
Chrome、Edge、Firefox 都支持双击 HTML 文件启动默认浏览器并渲染。但注意：file:// 协议下，Chrome 会禁用跨源请求、Service Worker、localStorage 在某些版本中也可能失效；Firefox 相对宽松些，但依然不支持 fetch 读取同目录下的 .json 文件。
- Windows：文件资源管理器中找到
index.html，双击即可 - macOS：在 Finder 中双击，或右键“打开方式”选 Safari / Chrome
- Linux：右键 → “在 Web 浏览器中打开”，或终端执行
xdg-open index.html
需要调试 JS 或加载本地资源？必须起一个本地服务器
只要页面里用了 fetch('./data.json')、import 模块、XMLHttpRequest，或者用了 history.pushState 的单页应用，file:// 就会失败——这不是你代码写错了，是浏览器故意这么设计的。
- 最轻量方案：用 Node.js 自带的
npx serve（需先装 Node）npx serve -s .
然后访问http://localhost:5000 - 无 Node 环境？Python 3 用户可用：
python3 -m http.server 8000
然后打开http://localhost:8000 - VS Code 用户可安装插件 Live Server，右键 HTML 文件点 “Open with Live Server”
Chrome 打开本地文件时提示 “Failed to load resource” 怎么办
错误信息通常是 net::ERR_FILE_NOT_FOUND 或 net::ERR_BLOCKED_BY_CLIENT，但真正原因往往是路径写错，或浏览器阻止了 file:// 下的动态加载。
- 检查路径是否用的是相对路径（如
./script.js），而不是绝对路径（/script.js会找根目录） - 确认引用的文件确实和 HTML 在同一目录，或子目录结构匹配
- 不要尝试加启动参数绕过限制（如
--allow-file-access-from-files），新版 Chrome 已废弃该参数，且存在严重安全风险
本地开发时，别依赖双击打开去验证交互逻辑；哪怕只是改一行 JS，也建议用 http://localhost 启服务——这点容易被跳过，但恰恰是多数“明明代码没错却跑不起来”的根源。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
