Claude Code + Nano Banana Pro：用 Skill 搭一个懂你的设计 Agent，一句话出图

1. 为什么我要在 Claude Code 里塞一个出图 SkillClaude Code 本身是个终端里的编码 Agent能读文件、跑命令、改代码但它默认不会画图。Nano Banana Pro 是图像生成模型出图质量不错尤其适合做封面、流程图、信息图这类设计物料。问题在于每次出图都要手动拼提示词、调参数、下载图片、检查文字有没有写错改一版风格全变再改文字成乱码来回折腾四五次才能用。我想要的不是「再打开一个网页工具」而是「在 Claude Code 里说一句话图就出来了」。这就需要 Skill 机制把 Nano Banana Pro 的 API 调用、提示词模板、出图后的自检逻辑全部封装成一个 Claude Code 能识别的技能包。你说「画一张讲 Skill 机制的封面图」Claude Code 自动读 Skill 配置、调 API、拿回图片、检查文字、不对就重试最后把成品路径告诉你。适合谁经常写技术文章需要配图的人、做产品文档要出流程图的人、以及想让 Agent 帮自己跑完整设计链路的人。下面我从零开始把 Skill 配置文件骨架、统一 Key/API 通道的 settings.json 片段、以及一句话触发出图的验证步骤全部给出来你复制配置就能跑通。2. 前置准备TaoToken 统一 Key 与 API 通道Claude Code 调外部模型 API 时最烦的是每个模型一套 Key、一套 Base URL、一套鉴权头。TaoToken 的作用是把这些统一成一个入口你拿一个 Key配一个 Base URL后面换模型只改模型名不用改鉴权逻辑。对 Skill 来说这意味着配置文件里只需要维护一份凭证出图 Skill 和对话模型共用同一条通道。先拿 Key。打开 https://taotoken.net/api-keys 登录后创建一个 API Key复制出来。这个 Key 同时用于 Claude Code 的模型对话和 Nano Banana Pro 的出图调用。注意不要把它写进 Git 仓库后面我会用环境变量引用。TaoToken 的 API 入口是 https://taotoken.net/api 不带任何多余路径。Claude Code 的 settings.json 里配置ANTHROPIC_BASE_URL指向它模型名按你实际用的填。如果你还没装 Claude Code先按官方文档装好能正常对话后再往下走。注意Key 只显示一次复制后存到密码管理器或本地环境变量文件里。后面所有配置都通过$TAOTOKEN_API_KEY引用不硬编码。3. Skill 配置文件骨架让 Claude Code 认识出图能力Claude Code 的 Skill 放在~/.claude/skills/目录下每个 Skill 一个文件夹里面至少有一个SKILL.md描述技能用途和调用方式外加可选的脚本或配置文件。我这里的出图 Skill 叫nano-banana-image目录结构如下~/.claude/skills/nano-banana-image/ ├── SKILL.md ├── config.json └── generate.pySKILL.md是给 Claude Code 看的说明书告诉它这个 Skill 能干什么、什么时候触发、参数怎么传。内容骨架--- name: nano-banana-image description: 调用 Nano Banana Pro 生成图像支持封面、流程图、信息图。当用户说“画一张”“出图”“生成封面”时触发。 --- # Nano Banana Pro 出图 Skill ## 用途 根据自然语言描述生成图像自动检查图中文字是否正确不对则重试。 ## 调用方式 运行 python generate.py --prompt 描述 --output 输出路径 ## 参数 - prompt: 图像描述必填 - output: 输出文件路径默认 ./output.png - size: 图像尺寸默认 1024x1024config.json存 API 通道和默认参数Key 从环境变量读{ api_base: https://taotoken.net/api, api_key_env: TAOTOKEN_API_KEY, model: nano-banana-pro, default_size: 1024x1024, max_retries: 3 }generate.py是实际干活的脚本负责拼请求、调 API、保存图片、返回结果。核心逻辑import os, json, requests, sys, argparse def load_config(): with open(os.path.join(os.path.dirname(__file__), config.json)) as f: return json.load(f) def generate(prompt, output, size): cfg load_config() api_key os.environ.get(cfg[api_key_env]) if not api_key: raise RuntimeError(缺少环境变量 cfg[api_key_env]) resp requests.post( cfg[api_base] /v1/images/generations, headers{Authorization: Bearer api_key}, json{model: cfg[model], prompt: prompt, size: size}, timeout120 ) resp.raise_for_status() data resp.json() img_url data[data][0][url] img requests.get(img_url, timeout120) with open(output, wb) as f: f.write(img.content) return output if __name__ __main__: p argparse.ArgumentParser() p.add_argument(--prompt, requiredTrue) p.add_argument(--output, default./output.png) p.add_argument(--size, default1024x1024) args p.parse_args() print(generate(args.prompt, args.output, args.size))这段脚本只做一件事拿 prompt 调 API把返回的图片 URL 下载到本地。重试逻辑放在 Skill 层面由 Claude Code 根据出图结果决定是否再调一次。4. settings.json 片段把 Key 和通道接进 Claude CodeClaude Code 的配置文件在~/.claude/settings.json。你需要把 TaoToken 的 Base URL 和 Key 配进去让 Claude Code 的模型对话走这条通道。片段如下{ env: { ANTHROPIC_BASE_URL: https://taotoken.net/api, ANTHROPIC_API_KEY: 你的TaoToken Key, TAOTOKEN_API_KEY: 你的TaoToken Key } }ANTHROPIC_BASE_URL和ANTHROPIC_API_KEY让 Claude Code 的对话模型走 TaoTokenTAOTOKEN_API_KEY是给上面generate.py读的两个 Key 是同一个只是变量名不同。如果你不想把 Key 明文写在 settings.json 里可以改成从 shell 环境变量继承{ env: { ANTHROPIC_BASE_URL: https://taotoken.net/api, ANTHROPIC_API_KEY: ${TAOTOKEN_API_KEY}, TAOTOKEN_API_KEY: ${TAOTOKEN_API_KEY} } }然后在~/.zshrc或~/.bashrc里加一行export TAOTOKEN_API_KEY你的Key重启终端和 Claude Code。这样 Key 不进配置文件也不怕误提交。配完后重启 Claude Code输入/skills看列表里有没有nano-banana-image。没有的话检查目录名和SKILL.md的name字段是否一致。5. 验证请求一句话触发出图并检查结果配置就绪后在 Claude Code 里直接说画一张讲 Claude Code Skill 机制的封面图风格简洁深色背景中间写“Skill”大字Claude Code 会识别到「画一张」触发词读取nano-banana-imageSkill调用generate.py把 prompt 传进去。你会在终端看到类似输出正在调用 Nano Banana Pro... 图片已保存到 ./output.png打开output.png检查。如果图中文字写错比如「Skill」变成「Skil」直接在 Claude Code 里说「文字错了改成 Skill其他不变」。Claude Code 会把修正后的 prompt 重新传给 Skill再出一版。实测下来把「文字必须准确」写进 prompt 模板后一次成功率明显提高。如果你想一次出多张可以说「画三张不同风格的封面图」Claude Code 会并行调三次 API分别保存为output_1.png、output_2.png、output_3.png。这比一张张等快很多。验证成功的标志终端返回图片路径打开图片内容符合描述文字无误。到这一步从描述到成图的链路就通了。6. 本篇常见错排查报错缺少环境变量 TAOTOKEN_API_KEY说明generate.py没读到 Key。检查~/.zshrc里的 export 是否生效echo $TAOTOKEN_API_KEY有没有输出。如果用的是 settings.json 明文配置确认TAOTOKEN_API_KEY字段拼写正确。报错401 UnauthorizedKey 无效或过期。去 https://taotoken.net/api-keys 重新生成一个替换配置后重启 Claude Code。注意 Key 前后不要有空格。报错404 model not foundconfig.json里的model字段和 TaoToken 支持的模型名不一致。检查模型名拼写确认 Nano Banana Pro 在当前通道可用。Skill 不触发Claude Code 没识别到「画一张」这类触发词。检查SKILL.md的description里是否包含触发词或者手动说「用 nano-banana-image Skill 画一张」。图片保存成功但打不开可能是下载了错误响应体。在generate.py里加一行打印resp.status_code和data确认返回的是图片 URL 而不是错误 JSON。文字反复写错在 prompt 里明确写「图中文字必须为XXX不要改动」并在 Skill 里加自检步骤——出图后让 Claude Code 读图确认文字不对就重试。这是 Skill 相比手动出图最大的优势经验可以沉淀下次不用重新踩坑。7. 把出图能力接进你的日常工作流配好这个 Skill 后你可以把它和写作 Skill 组合。比如你说「写一篇讲 API 网关的文章配一张封面图」Claude Code 先调写作 Skill 生成正文再调出图 Skill 生成封面最后把两个文件路径一起给你。整个过程你只说了一句话。长期做编码或 Agent 开发的话建议把常用 Skill 统一管理Key 和通道走 TaoToken 一份配置。需要看模型对话效果就去 https://taotoken.net/model-chat 需要管理 Key 就去 https://taotoken.net/api-keys 接入文档在 https://taotoken.net/doc 。如果你打算把出图 Skill 用在持续集成或批量生成场景可以看看 Coding Planhttps://taotoken.net/coding-plan 把调用额度规划好避免跑一半断掉。我踩过的坑是一开始把 Key 硬编码在generate.py里换 Key 时改了三个文件。后来统一用环境变量只改一处。另外 Skill 的description要写清楚触发词不然 Claude Code 不知道什么时候该用它。把这两点做好后面基本不用再动配置。