5分钟本地部署AI流程图工具next-ai-draw-io完整上手教程【免费下载链接】next-ai-draw-ioA next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.项目地址: https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io还在手动拖工具栏画架构图吗next-ai-draw-io 把画图变成对话你打一行自然语言它就产出带连线和图标的流程图直接在 draw.io 画布上渲染。它是一个可本地部署的 AI 流程图生成工具跑在你自己的机器上数据不出内网。这篇 next-ai-draw-io 部署教程带你在 4 步内跑通并把高频坑一次说清。先看到效果你输入画一张部署在 AWS 上的应用架构图它产出 User → EC2 → S3 / Bedrock / DynamoDB 的成品图箭头和 AWS 容器框都画好了。你输入画个灯泡故障排查流程图它就给出带判断分支的完整流程。原理一句话AI 把你的话翻译成 draw.io 的 XML画布直接渲染。类似给实习生下指令交出来的是成品。场景传统 draw.io 画法next-ai-draw-io上手画图记工具栏按钮、拖元素连线写一行自然语言改已有图找到元素手动挪位置说加个负载均衡器画云架构图逐个找 AWS/Azure 官方图标自动选用对应厂商图标改错了想回退无历史记录只能重画AI 每次修改存快照可恢复本地部署跑起来拿代码克隆仓库并装依赖顺手复制一份配置文件。git clone https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io cd next-ai-draw-io npm install cp env.example .env.local填配置打开.env.local。这个文件相当于程序的设置卡只改三处AI_PROVIDER用哪家 AI、AI_MODEL模型 ID、对应的 API Key如OPENAI_API_KEY。各提供商的写法见 AI 提供商配置。启动npm run dev浏览器打开http://localhost:6002就能写了。或者走容器一条命令跑官方镜像docker run -d -p 3000:3000 -e AI_PROVIDERopenai -e AI_MODELgpt-4o -e OPENAI_API_KEYyour_key ghcr.io/dayuanjiang/next-ai-draw-io:latest然后打开http://localhost:3000。实际用一下打开页面在输入框敲Draw a lamp troubleshooting flowchart。AI 先流式输出思考过程然后画布上出现流程图起点是粉色框Lamp doesnt work灯泡不亮往下连到黄色判断框Lamp plugged in?插上了吗——选 No 指向绿色步骤Plug in lamp选 Yes 继续到第二个判断Bulb burned out?灯丝烧断了吗选 Yes 指向Replace bulb选 No 落到Repair lamp收尾。不满意就继续提要求比如把判断框改成红色。它会原地修改画布不推倒重来。每次改动都进版本历史后面改砸了可以回退到任一份快照。按需配置最常用的就这几个其余参数看 env.example参数作用默认值AI_PROVIDER选 AI 提供商bedrock / openai / deepseek 等bedrockAI_MODEL模型 ID逗号分隔可配多个随提供商而定OPENAI_API_KEYOpenAI 及兼容服务的密钥空MAX_OUTPUT_TOKENS输出上限思考与图表共用64000ADMIN_PASSWORD后台 /admin 的密码不设置即关闭ACCESS_CODE_LIST用户访问码逗号分隔不设置NEXT_PUBLIC_DRAWIO_BASE_URLdraw.io 嵌入地址内网自建时改它https://embed.diagrams.net想让所有用户共享多个服务端模型、不用各自带 Key就设置AI_MODELS_CONFIG环境变量或在项目根目录放一个ai-models.json。各提供商详细写法看 AI 提供商配置文档管理面板看 管理面板文档。避坑手册这三个是 next-ai-draw-io 常见问题里的最高频均来自官方 FAQ坑1内网环境画布空白症状提示找不到 embed.diagrams.net 的服务器 IP 地址。 原因NEXT_PUBLIC_*是构建时变量会编译进 JS运行时在容器里设置无效。 解法构建镜像时用 build args 传入NEXT_PUBLIC_DRAWIO_BASE_URL指向自建的 draw.io详见 离线部署。坑2自建模型只思考不画图症状本地模型如 Qwen只流式输出思考过程不出图表。 原因模型太小跟不上 tool calling 指令或服务端没开启工具调用。 解法换 32B 参数以上的模型并在推理服务里启用 tool choice比如 vLLM 加--enable-auto-tool-choice。坑3上传图片提示未提供图片症状上传一张已有图让它重画却报错。 原因当前模型不支持视觉能力。 解法换支持视觉的模型或选模型名带vision/vl的。最后一步next-ai-draw-io 把画图变成说图3 个环境变量加 1 条启动命令npm 或 Docker 都能跑数据留在自己机器上。下一步去哪查Docker 部署AI 提供商配置FAQ第一个动作先用默认配置跑通灯泡流程图这个例子跑通后再把AI_MODEL换成你手头的模型。【免费下载链接】next-ai-draw-ioA next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.项目地址: https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考