猎豹浏览器无HTML5专用备份功能，需手动抓取资源或用HTTrack/WebSite-Downloader等工具保存完整源文件结构并确保本地可运行。
猎豹浏览器本身不提供 HTML5 应用的专用备份功能，它只是一个基于 Chromium 内核的前端渲染工具；真正需要备份的是 HTML5 页面的源文件结构与运行依赖——而不是“在猎豹里点几下就能导出一个可离线运行的包”。
所以，所谓“猎豹浏览器备份 HTML5”，本质是：用猎豹打开目标页 → 借助通用技术手段保存整套 HTML5 资源 → 确保本地双击能跑起来。下面分场景给出实操路径。
用开发者工具手动抓取单页 HTML5 结构
适用于演示页、Canvas 小游戏、WebGL 可视化等单 HTML 文件 + 内联或同目录资源的轻量项目。
- 在猎豹中打开目标页（确保已启用开发者工具：按
F12） - 切换到
Network面板 → 刷新页面 → 筛选类型为HTML、JS、CSS、IMG、MP4、WEBM - 逐个右键 →
Open in new tab→ 新标签页中右键另存为，注意保持原始文件名和扩展名 - 主
index.html必须和所有资源放在同一文件夹下；若引用了js/main.js，就得有js/子目录 - ⚠️ 常见坑：
fetch()加载的 JSON 或动态插入的iframe地址不会出现在 Network 列表里，得手动检查控制台（Console）或 Elements 面板找真实请求路径
用 HTTrack 批量镜像整个 HTML5 站点
适合含多页面、路由跳转（如 Vue Router / React Router 的 history 模式）、静态资源分散部署的项目。
蓝湖代码转vue2.0+element-ui
下载
将静态 Vue 页面(index.vue)改造为动态页面(Custom.vue)；稿源仅限 index.vue、其引用的 CSS 与资源路径，禁止参考仓库内其他文件。Invoke when user wants to transform a static Vue page into a dynamic data-driven page with Element UI components.
立即学习“前端免费学习笔记（深入）”；
- 下载安装
HTTrack Website Copier（Windows/macOS/Linux 全支持） - 新建项目时 URL 填完整地址，例如
https://example.com/demo/，不要漏末尾斜杠 - 关键设置：
Follow links into subdirectories✅，Save HTML files with original extension (.html)✅ - 进
Options → Scan Rules，添加允许规则：+*.html +*.js +*.css +*.png +*.jpg +*.webm +*.mp4 +*.json，排除 CDN 域名（如-*.cloudflare.com） - ⚠️ 常见坑：HTTrack 默认不抓取
#后的 hash 路由（如/demo/#/game），需额外配置Scan URLs matching pattern加上.*并勾选Scan URLs with # (hash)
用 WebSite-Downloader 抓取并自动修复路径
当目标页大量使用绝对路径（如 src="/js/app.js"）或跨子域加载资源时，HTTrack 可能失效，这时 Python 工具更鲁棒。
- 需先装 Python 3.6+，然后执行：
git clone https://gitcode.com/gh_mirrors/web/WebSite-Downloader cd WebSite-Downloader pip install urllib3
- 编辑
WebSite-Downloader.py，改最后一行为：manager = Manager('https://target-site.com/html5-app/') # 注意协议+域名+路径 manager.start() - 运行
python WebSite-Downloader.py，完成后会生成target-site-com-html5-app-site/文件夹 - 该工具会自动把
https://target-site.com/js/app.js改成js/app.js，并下载对应文件，双击index.html即可离线运行 - ⚠️ 常见坑：若页面 JS 通过
document.write动态注入 script 标签，或用eval()加载远程代码，这类逻辑无法被静态爬虫捕获，必须人工补全
本地修改后如何保存与回滚
你在猎豹里调试时改了 HTML/CSS/JS，但关闭标签就丢了？这不是浏览器的问题，是你没做版本管理。
- 每次实质性修改后，立刻执行：
git add index.html js/ css/ git commit -m "fix canvas resize bug on mobile"
- 别依赖猎豹的“另存为网页”功能——它只存渲染后 DOM，丢掉注释、原始结构、外部脚本链接，且无法还原 JS 逻辑
- 如果只是临时试改，用 VS Code 开启
files.autoSave+ 安装Local History插件，每 30 秒自动生成快照，误删也能秒恢复 - ⚠️ 最容易被忽略的一点：HTML5 的
localStorage和indexedDB数据是绑定域名的，本地双击file://打开时这些 API 会被禁用（跨域限制），必须用http-server或 Python 的python -m http.server 8000启服务才能测试真实存储行为
真正卡住人的从来不是“怎么点”，而是没想清楚：你要备份的是「能运行的代码」，不是「当时看到的画面」。路径、协议、执行上下文，缺一不可。
