用VSCode画时序图

5,176 阅读1分钟

前言

我不喜欢用图形编辑器画图,因为常常陷入调整格式的深渊。于是找到了这个用代码来画图的方法,发现极其好用。

配置

  • 下载 Visual Studio Code

  • 下载插件

  • 新建文件扩展名.seqdiag

  • 设置展示风格sequencediagrams.diagram.style,可选手绘or正常

  • 启动实时预览:cmd + shift + p 调出命令模式,执行Show Sequence Diagram Preview

语法

  • 注释(不可预览,也不会对预览造成影响)
# comment
  • 标题
Title: This is a title

  • 同步调用
A->B: Hello

  • 异步调用
A->>B

  • 回复消息
A-->B: Hello

  • 笔记
Note left of A: Left note
Note right of A: right note
Note over A: over note
Note over A,B: over both A and B

  • 重新排序,提前声明顺序,会覆盖后续语法的顺序
participant B
participant A
A->B: Hello

链接

欢迎关注我的公众号SlowCoding

Slow Coding