项目背景
在软件开发过程中，UML 图是需求分析和系统设计的重要工具。但传统的 UML 绘制工具要么需要安装客户端，要么不支持 AI 辅助，学习成本高。
本项目旨在打造一个在线 UML 协同设计工具，核心亮点是接入智谱 AI，用户只需用自然语言描述系统需求，即可自动生成 UML 图。
🔗 在线体验：http://8.130.43.139:8080

🔗 源码地址：https://gitee.com/sayuri88/uml-tool

技术选型

层级	选型	理由
前端框架	Vue 3 + Vite 8	组合式 API 开发效率高，Vite 构建速度快
UI 组件库	Element Plus	开箱即用的企业级组件
UML 渲染	Mermaid.js	文本驱动绘图，支持多种图表类型
后端框架	Spring Boot 3.5	Java 生态成熟，稳定性好
ORM	MyBatis	轻量灵活，SQL 可控
AI 服务	智谱AI GLM-4-flash	国内可用，免费额度充足
部署	Docker Compose	一键部署，环境一致性好

核心功能

1. AI 智能生成 UML
用户输入自然语言描述，后端调用智谱 AI 将其转换为 Mermaid 格式代码：

输入：设计一个学生选课系统，包含学生、课程、选课记录
输出：Mermaid classDiagram 代码

2. 在线编辑器
左右分栏设计：
左侧：Mermaid 代码编辑器
右侧：实时渲染预览
支持类图、时序图、用例图、ER 图四种类型。

3. 项目与图表管理
用户注册/登录
创建/管理多个项目
每个项目下可创建多张 UML 图
图表内容持久化到 MySQL

4. 导出功能
支持将预览的 UML 图导出为图片文件。

架构设计

┌─────────────────────────────────────────────┐
│ Nginx:80 │
│ ┌──────────────┐ ┌──────────────────────┐ │
│ │ 静态文件 │ │ /api/ → backend:8081 │ │
│ │ (Vue dist) │ │ (反向代理) │ │
│ └──────────────┘ └──────────────────────┘ │
└─────────────────────────────────────────────┘
│
┌─────────────┼─────────────┐
▼ ▼ ▼
┌──────────┐ ┌──────────┐ ┌──────────┐
│ MySQL │ │ 后端 API │ │ 智谱 AI │
│ 数据库 │ │ 服务 │ │ 服务 │
└──────────┘ └──────────┘ └──────────┘

Docker 部署
项目通过 Docker Compose 编排三个服务：

services:
  mysql:     # MySQL 8.0 数据库
  backend:   # Spring Boot 后端（依赖 MySQL 健康检查）
  frontend:  # Nginx + Vue 前端（反向代理 /api/ 到后端）

部署到阿里云：

# 1. 安装 Docker
curl -fsSL https://get.docker.com | sh
2. 配置镜像加速（国内服务器必须）
cat > /etc/docker/daemon.json << 'EOF'
{
"registry-mirrors": [
"https://docker.m.daocloud.io",
"https://docker.1panel.live"
]
}
EOF
systemctl restart docker
3. 拉取代码 & 打包
git clone https://gitee.com/sayuri88/uml-tool.git
cd uml-tool/uml-tool/backend && ../mvnw clean package -DskipTests
4. 一键启动
cd ..
docker compose up -d --build

踩坑记录
部署过程中遇到了不少问题，记录几个典型的：

问题	原因	解决方案
Docker 构建前端失败	Node 18 不满足 Vite 8 要求	Dockerfile 改为 node:22-alpine
Docker 构建后端失败	JAR 通配符与 pom.xml 不匹配	umltool-*.jar → uml-tool-*.jar
镜像拉取超时	Docker Hub 被墙	配置国内镜像加速器
端口 80 被占用	WSL 中继进程占用 IPv6 端口	前端映射改为 8080
阿里云无法访问	安全组未开放端口	控制台添加入方向 TCP 规则

总结
本项目实现了一个完整的 UML 在线设计工具，涵盖前后端开发、AI 接入、Docker 容器化部署的全流程。通过智谱 AI 的加持，降低了 UML 建模的门槛，让开发者可以专注于系统设计本身。