AI助手（MCP）

工具内置 AI 助手，用对话描述需求完成工程读写与校验；同一套工具与技能也能以本机 MCP（Model Context Protocol）服务接到 Codex、Claude Code、Cursor、Trae、Qcode、VS Code 等外部Agent。

启用 AI 助手

打开工程窗口，点击顶部工具栏的 AI助手 按钮，右侧打开 AI 面板。

首次使用在面板右上角点 设置 -> AI 助手，打开「启用 AI 助手」并填写模型接入：

建议选择 多模态模型：MCP工具能把改动后的页面预览图一并交给模型，模型对照截图判断实际效果，再据此继续优化。

技能同步

技能文档（jieli-lvgl-ui）能让 Agent 了解控件字段、样式枚举、事件与资源用法。工程内技能与工具自带技能不一致时，同步按钮出现红点，悬浮显示新增 / 覆盖 / 删除数量，点开确认清单后写入工程；写入哪些目录在 设置 -> 技能同步 里配置，初始为 .agents/skills。

使用

在输入框描述需求，Enter 发送，Shift+Enter 换行，运行中按 Esc 停止。输入 / 打开命令菜单（校验、渲染预览、新建页面等），输入 @ 提及工程内的页面，粘贴截图作为参考图。助手会读取工程结构、执行修改，并在改动后给出预览图与校验结果。

面板右上角依次是历史会话、开启新会话、同步技能、设置。

规划 / 执行

外部 Agent 接入（MCP）

外部客户端与内置助手使用同一套 MCP 工具和同一份技能文档，配置完成后同样用自然语言读写、校验工程。

前提

1. 在 UI 工具里打开一个工程窗口，MCP 工具由该窗口执行。
2. 在 AI 面板点同步按钮，把技能文档写入工程，Agent 才能拿到MCP工具用法。

配置

设置 -> 外部 Agent 页显示服务状态，并给出下列可直接复制的配置：

客户端只支持填写地址时，用页面显示的服务地址接入：http://127.0.0.1:8765/mcp（Streamable HTTP）或 http://127.0.0.1:8765/sse（SSE）。

可以在客户端上手动配置 MCP，也可以让 Agent 自动帮你装好：把下面这段提示词发给客户端里的 Agent 即可（<node>、<mcp-stdio.mjs> 用「外部 Agent」页给出的实际路径替换）。

请把本机的 jieli-gui MCP 服务加到你的 MCP 配置里，完成后调用 list_projects 确认能看到我在 UI 设计工具中打开的工程：

{
  "mcpServers": {
    "jieli-gui": {
      "command": "<node>",
      "args": ["<mcp-stdio.mjs>"]
    }
  }
}

Agent 能列出页面，说明 MCP 与技能都已就绪。

技能目录

设置 -> 技能同步 里配置写入目录，初始为 .agents/skills，大部分主流 Agent 都能识别，通常无需改动；若客户端只读取固定的项目级目录，把该目录加进去后重新同步一次即可：

使用

把下面这段作为首轮提示词发给 Agent，让它先读技能再动手（<工程根> 与需求按实际情况替换）：

先读当前工程的技能文档 <工程根>/.agents/skills/jieli-lvgl-ui/SKILL.md（references 按需再读），再用 MCP 服务 jieli-gui 的工具操作我打开的工程。

需求：<在这里写你的需求，例如：新增一个登录页面，包含标题和两个按钮>

常见问题