drawio-gcp

Draw.io GCP

在 draw.io 中绘制正确的 Google Cloud 架构图。此技能是一个轻量级前端；确定性引擎、验证器和规则位于 drawio-ai-kit 软件包中，可通过 drawio-ai CLI 调用。

0. 预检 — 必须已安装 CLI

command -v drawio-ai >/dev/null 2>&1 || echo "Install the Kit first:  npm i -g github:sparklabx/drawio-ai-kit"

如果 drawio-ai 不在 PATH 中，请停止并告知用户运行 npm i -g github:sparklabx/drawio-ai-kit。切勿自行运行 npm i -g——未经用户同意，绝不修改用户的全局环境。

1. 委派构建（首选，前提是你的运行环境支持）

如果你的运行环境可以启动能运行 shell 命令并读取图像的自主子 Agent（例如 Claude Code 的 Task 工具或通用 Agent），请在子 Agent 中运行整个构建流程——规则、图标搜索以及每次渲染／修复迭代都不会占用本次对话的资源。如果不支持（或子 Agent 无法读取图像），请跳到下方的内联流程——流程和规则相同。

启动子 Agent 前，先确定子 Agent 无法询问的信息：图表范围、输出目录（用户项目下的绝对路径）和文件名。请自行运行上述预检。对于多图表请求，请为每张图表分别启动一个子 Agent，并行执行且使用不同的文件名。

模型路由——如果你的运行环境允许选择子 Agent 使用的模型，请根据任务权重进行路由：当请求符合规则中 Templates 表格的模板时，使用快速／低成本档（Claude Haiku 级别——必须支持视觉能力），因为复现过程是机械性的，验证器的建议字符串会说明每项修复方法；对于自由绘制或新颖架构，使用你的默认强模型。如果低成本子 Agent 返回 VALIDATE not ok 或 ITERATIONS > 3，请在接管内联流程前，用强模型重新启动一次。多图表请求：分别为每张图表选择模型。

子 Agent 提示词（填入每个 <...>）：

Build a GCP architecture .drawio diagram with the drawio-ai CLI.
Request: <user's request + clarifications, verbatim>
Output: <ABS_PROJECT_DIR>/<NAME>.drawio — never write inside the Kit, never into cwd.
Follow exactly:
1. Set ROOT="$(drawio-ai root)". Read $ROOT/docs/api-cheatsheet.md — the full layout-engine
   API in one file; never read library source.
2. Run `drawio-ai workflow` and `drawio-ai principles --mode gcp` — the source of
   truth. (Fallback if a command is blocked: read $ROOT/rules/*.md directly.)
3. Look up every icon with ONE batched `drawio-ai search "a, b, c"`; never recolor icons.
4. Scaffold, don't write: `drawio-ai scaffold --list`, pick the closest template, then
   `drawio-ai scaffold <name>.mjs -o <dir>/build.mjs` — the script arrives runnable
   (absolute imports, self-validating, self-rendering with an issues list). Edit only the
   deltas. If no template is close AND you'd change more than half of it, Write a new
   script instead (keep the scaffold's self-check tail). Layout engine only
   (group/frame/grid/icon/box + renderTree), NO hand-written coordinates.
5. Each `node build.mjs` run prints validate JSON AND the render's machine-readable
   `issues` list. Fix from THAT checklist — all issues in one Edit round — then re-run.
   Loop until issues is empty.
6. Only when issues is empty: Read the PNG once as final visual confirmation (list any
   remaining visual problems, fix ALL in one round). Target <= 2 PNG reads total. Then
   render once WITHOUT --check for the final deliverable PNG.
Do NOT invoke any drawio skill — this prompt already contains the full procedure.
Do not ask questions — make the standard choice and record it under ASSUMPTIONS.
Return EXACTLY this block, nothing else:
DRAWIO: <absolute path to .drawio>
PNG: <absolute path to .png>
VALIDATE: <verbatim final validate JSON>
ICONS: <comma-separated icon names used>
ITERATIONS: <number of render/fix cycles>
SUMMARY: <one sentence describing the diagram>
ASSUMPTIONS: <choices made without asking, or "none">

将 DRAWIO、PNG 和 SUMMARY 原样转达给用户；切勿在本次对话中重新读取 .drawio 或 PNG——子 Agent 已经完成视觉自检。如果 VALIDATE 不是 ok，请通过内联流程接手构建（build .mjs 和 .drawio 文件位于返回的路径中）。

内联流程（不支持子 Agent 时）

1. 共享工作流

drawio-ai workflow

输出每张图表都要遵循的“构建 → 验证 → 渲染 → 写入项目路径”流程。请阅读；它是流程的权威说明。

2. 领域规则

drawio-ai principles --mode gcp

返回 GCP 规则、共享原则和目录分类。

3. 使用引擎构建，然后验证并渲染

确定 Kit 的安装目录，然后通过绝对路径 import 引擎（确切写法见共享工作流）：

ROOT="$(drawio-ai root)"     # absolute path to the installed Kit

使用声明式布局引擎构建（不得手写坐标），然后执行： drawio-ai validate <file> → drawio-ai render <file> -o <file>.png>（Read PNG 进行视觉自检）→ 将 .drawio 写入用户项目下的绝对路径（绝不写入 Kit 或 cwd）。

领域说明

层级：Organization → Folder → Project → global VPC → regional Subnet。 VPC 是跨越所有区域的全局资源；子网是区域资源。共享 VPC 允许一个宿主项目拥有 VPC，同时服务项目可在其中部署资源。

自检（交付前）

• 使用布局引擎构建——未手写坐标。
• drawio-ai validate → ok，无警告，无建议。
• drawio-ai suggest-layout → 推荐的原型与布局匹配；没有稀疏性（one-icon-frame）警告。
• 所有图标均来自 drawio-ai search（分类颜色保持不变）。
• drawio-ai render 视觉自检通过。
• 输出已写入用户项目下，而非 Kit。