用途
ray.so Code Snippet Image Generator 是一个用于生成精美代码片段图片的技能。它借助 ray.so 的渲染能力,把代码转换为带样式的高清图片并保存到本地,适合需要将代码以图片形式分享或展示的场景。
主要能力
- 使用 ray.so 生成代码片段图片,并保存为本地 PNG 文件。
- 支持从 ray.so 的 GitHub 仓库动态获取当前可用的主题和语言列表。
- 支持配置主题、语言、深色/浅色模式、渐变背景、内边距、行号、标题等样式参数。
- 使用 html-to-image 库以 4 倍像素比渲染,输出文字清晰的高分辨率图片,且画面自动适配代码内容,无多余空白。
使用方式
- 确认 agent-browser 可用(通过
which agent-browser检查)。若不可用,则无法继续。 - 使用 curl 从 ray.so 的 GitHub 仓库获取可用主题与语言列表。
- 通过 AskUserQuestion 向用户询问全部样式参数,顺序为:主题、语言(可推断时跳过)、深色/浅色模式、背景、内边距、行号、标题。
- 将代码进行 Base64 编码,再 URL 编码,并把所有参数放入 ray.so 的 URL 哈希(
#之后)中构建链接。 - 使用 agent-browser 打开该 URL,等待页面渲染完成,加载 html-to-image 库,以
pixelRatio:4截取图片,再将 data URL 转换为 PNG 文件保存。 - 向用户报告保存的文件位置后即停止。
适用场景
- 用户要求创建代码图片、代码截图或代码片段图片。
- 需要将代码以带样式的图片形式用于分享、演示或文档。
限制
- 必须依赖 agent-browser 进行截图,若其不可用则无法执行。
- 用户必须提供代码片段,可直接给出或指向上下文中的文件/选区。
- 生成前必须询问全部样式参数,并展示所有可用选项。
- 所有参数必须放在 URL 哈希中,而非查询字符串。
- 除非用户明确指定,否则不询问输出路径/文件名,默认保存到当前工作目录。
- 对于非常长的代码片段,ray.so 可能会截断,建议拆分为多张图片。
- 若 curl 获取主题/语言失败,可使用资料中列出的常见默认值。