「VisualStudioCode/Mermaid」の版間の差分
提供: 初心者エンジニアの簡易メモ
(→サンプル) |
(→サンプル) |
||
行2: | 行2: | ||
https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid | https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid | ||
+ | ==プレビュー== | ||
+ | VisualStudioCodeを、開いて、コードを入力して、右上の虫眼鏡をクリックすると、プレビューできる。 | ||
==サンプル== | ==サンプル== | ||
+ | ===クラス図=== | ||
class.md | class.md | ||
<pre> | <pre> | ||
```mermaid | ```mermaid | ||
− | + | classDiagram | |
− | + | class User{ | |
− | + | +Int id | |
− | + | +String name | |
− | + | +name() | |
− | ``` | + | } |
+ | ``` | ||
</pre> | </pre> | ||
+ | |||
+ | ===関連クラス=== | ||
+ | relation.md | ||
+ | <pre> | ||
+ | ```mermaid | ||
+ | classDiagram | ||
+ | |||
+ | class User{ | ||
+ | +Int id | ||
+ | +String name | ||
+ | +name() | ||
+ | } | ||
+ | |||
+ | User --|> BaseUser | ||
+ | Car --|> BaseCar | ||
+ | ``` | ||
+ | </pre> | ||
+ | |||
+ | |||
+ | 参考:https://qiita.com/hirokiwa/items/1a490c75961efd1e1487 |
2023年12月7日 (木) 00:23時点における版
インストール
https://marketplace.visualstudio.com/items?itemName=bierner.markdown-mermaid
プレビュー
VisualStudioCodeを、開いて、コードを入力して、右上の虫眼鏡をクリックすると、プレビューできる。
サンプル
クラス図
class.md
```mermaid classDiagram class User{ +Int id +String name +name() } ```
関連クラス
relation.md
```mermaid classDiagram class User{ +Int id +String name +name() } User --|> BaseUser Car --|> BaseCar ```