静态网站镜像器
TinyScraper
by alukardo
简单静态网站镜像爬虫。给定 URL 下载整个域名下的 HTML、JS、CSS 和静态资源到本地，支持离线浏览。
安装
claude skill add --url https://github.com/openclaw/skills文档
TinyScraper - 静态网站镜像工具
纯 Python3 标准库，无额外依赖
📁 目录结构
TinyScraper/
├── SKILL.md
├── bin/
│ └── tinyscraper # CLI 入口
├── lib/
│ └── crawler.py # 核心爬虫逻辑
├── conf/
│ └── .tinyscraper.conf # 配置文件
├── assets/
├── scripts/
│ └── test_crawler.py # 自动化测试
└── references/
└── SPEC.md # 格式标准文档
🎯 Skill 职责
将目标网站完整镜像到本地，包括：
- HTML 页面（保持目录结构）
- JS、CSS、图片、字体等静态资源
- HTML/CSS 中的相对路径自动重写
- 外部链接保留原值，不处理
🔖 触发场景
- 用户要求"下载网站"、"镜像网站"、"离线保存网页"
- 用户提供 URL 并要求"爬取整个网站"
- 用户要求"抓取网站所有资源"
📋 执行步骤
1. 确认目标
- 检查 URL 是否为简单静态网站（SPA / JS 驱动类网站不适合）
- 使用
--dry-run预览爬取范围
2. 启动爬取
tinyscraper "https://example.com"
3. 监控进度
- 实时显示：已爬页面数、资源数、待爬队列长度
- 失败 URL 记录到日志
4. 完成后
- 镜像保存于：
tmp/mirrors/{domain}/ - 可用浏览器直接打开
index.html离线浏览
⚙️ 命令详解
# 完整镜像
tinyscraper "https://example.com"
# 预览模式（只列出 URL，不下载）
tinyscraper "https://example.com" --dry-run
# 清理已下载的镜像
tinyscraper -d example.com
# 显示帮助
tinyscraper -h
📦 输出标准
目录结构
tmp/mirrors/{domain}/
├── index.html
├── page/
│ └── index.html
├── assets/
│ ├── style.css
│ └── script.js
├── images/
│ └── logo.png
路径规范
| URL | 本地路径 |
|---|---|
/ | index.html |
/about | about/index.html |
/page?id=1 | page/index.html |
/style.css?v=1.2 | style.css（去重） |
/page#section | # 锚点去除，视为同一文件 |
资源重写规则
- HTML 内所有同域
href/src→ 相对路径 - CSS 内所有
url()→ 相对路径 - 外部链接（其他域名）→ 保留原值不变
mailto:/tel:/javascript:→ 保留原值不处理
日志输出
[STEP] 🌐 开始镜像: https://example.com
[STEP] 📁 保存目录: tmp/mirrors/example.com
[INFO] 保存页面: https://example.com -> .../index.html
[INFO] 保存资源: https://example.com/style.css -> .../style.css
[STEP] 爬取 (1): https://example.com/about
[INFO] 进度: 已爬 3 页面, 12 资源, 5 待爬
...
[INFO] ==================================================
[INFO] 镜像完成!
[INFO] 页面: 15
[INFO] 资源: 48
[INFO] 失败: 2
[INFO] 目录: tmp/mirrors/example.com
⚠️ 局限性
-
仅支持简单静态网站（SPA/React/Vue 等 JS 驱动类不适用）
-
外部域名资源（如 CDN 上的 JS）不会下载
-
需目标网站允许爬取（robots.txt 规则被忽略）
相关 Skills
前端设计
by anthropics
面向组件、页面、海报和 Web 应用开发，按鲜明视觉方向生成可直接落地的前端代码与高质感 UI，适合做 landing page、Dashboard 或美化现有界面，避开千篇一律的 AI 审美。
✎ 想把页面做得既能上线又有设计感，就用前端设计：组件到整站都能产出，难得的是能避开千篇一律的 AI 味。
网页应用测试
by anthropics
用 Playwright 为本地 Web 应用编写自动化测试，支持启动开发服务器、校验前端交互、排查 UI 异常、抓取截图与浏览器日志，适合调试动态页面和回归验证。
✎ 借助 Playwright 一站式验证本地 Web 应用前端功能，调 UI 时还能同步查看日志和截图，定位问题更快。
网页构建器
by anthropics
面向复杂 claude.ai HTML artifact 开发，快速初始化 React + Tailwind CSS + shadcn/ui 项目并打包为单文件 HTML，适合需要状态管理、路由或多组件交互的页面。
✎ 在 claude.ai 里做复杂网页 Artifact 很省心，多组件、状态和路由都能顺手搭起来，React、Tailwind 与 shadcn/ui 组合效率高、成品也更精致。
相关 MCP 服务
GitHub
编辑精选by GitHub
GitHub 是 MCP 官方参考服务器，让 Claude 直接读写你的代码仓库和 Issues。
✎ 这个参考服务器解决了开发者想让 AI 安全访问 GitHub 数据的问题，适合需要自动化代码审查或 Issue 管理的团队。但注意它只是参考实现，生产环境得自己加固安全。
Context7 文档查询
编辑精选by Context7
Context7 是实时拉取最新文档和代码示例的智能助手，让你告别过时资料。
✎ 它能解决开发者查找文档时信息滞后的问题，特别适合快速上手新库或跟进更新。不过，依赖外部源可能导致偶尔的数据延迟，建议结合官方文档使用。
by tldraw
tldraw 是让 AI 助手直接在无限画布上绘图和协作的 MCP 服务器。
✎ 这解决了 AI 只能输出文本、无法视觉化协作的痛点——想象让 Claude 帮你画流程图或白板讨论。最适合需要快速原型设计或头脑风暴的开发者。不过，目前它只是个基础连接器，你得自己搭建画布应用才能发挥全部潜力。