Workflow
Mermaid Chart
icon
搜索文档
VS Code 整个 AI 绘图扩展,画图比写代码还快!效率不得杆杆~~~
菜鸟教程· 2025-06-16 09:48
VSCode概述 - 由微软开发的免费开源代码编辑器,发布于2015年并迅速成为开发者社区热门工具 [1][2] - 支持跨平台运行(Windows/macOS/Linux)并拥有庞大扩展市场,涵盖语言支持、代码格式化、版本控制集成等功能 [3] - AI技术深度融入后,其插件生态成为提升开发效率的关键因素 [4] Mermaid图表工具 - 基于文本的图表绘制工具,支持流程图、序列图、甘特图等9种图表类型,采用类Markdown语法 [7][9] - 核心优势包括文本驱动(便于版本控制)、语法简洁、集成实时预览功能 [9][14] - 与AI工具结合可自动生成Mermaid语法代码,简化图表创建流程 [10] Mermaid Chart扩展功能 - 官方开发的VS Code扩展,提供图表创建/编辑/预览全流程解决方案,支持本地实时预览 [11][14] - 集成AI智能生成:通过GitHub Copilot Chat输入指令(如@mermaid-chart)可自动解析代码生成类图 [19][21] - 支持云架构图自动生成:扫描工作区配置文件后一键输出可视化架构图 [31] - 具备智能再生功能,可检测代码变更并同步更新关联图表 [29] 操作示例 - 创建饼图时通过.mmd文件编写语法(如`"Dogs":386`),右键即可预览 [16] - 复杂案例中AI可解析Java类生成对应类图,点击"Go to Diagram"查看可视化结果 [21][25]