🔰

VS Code Drawio - 小ネタその1

2025/01/23に公開

記事内容

私が良く使用している[ VS Code ] の 拡張機能[ drawio ]の小ネタをご紹介いたします

今回は、以下をご紹介いたします

1.そもそもなんでVS Code を使用するのか?
2.VS Code インストール
3.VSCode 拡張機能「drawio」インストール
4.drawioファイル作成

1.そもそもなんでVS Code を使用するのか?

1ー1.使用理由 :

シンプルに一言で結論を申します!
軽量な統合開発環境で、さまざまな拡張機能があるため! = 便利!!

1-2.メリット / デメリット:

どのようなものにもメリット / デメリットが存在しておりますので、下記の図を参考にご自身に合っている方はぜひ!VSCodeをご使用ください。


2.[VS Code インストール]

2-1.インストール方法については、以下の記事を参照ください。

https://qiita.com/furu38/items/6776acba6621012ee475

2-2.インストール後の日本語対応については、以下の記事を参照ください。

https://www.javadrive.jp/vscode/install/index4.html


3.[VS Code 拡張機能「drawio」インストール]


手順1.VSCodeを開いたあと「拡張機能(ショートカット:Ctrl + Shift + X)」を開く


手順2.以下の①~③を実施

①.機能検索欄から「drawio」と入力
②.検索一覧から「Draw.io Integration」を選択
③.「Draw.io Integration」の「インストール」を選択

手順3.インストールが完了したら、VSCodeを再起動


4.[ drawioファイル作成 ]

手順1.新規ファイル作成

所定のフォルダから新しいファイルのアイコンを選択

もしくは

ツールバー「ファイル」から「新規ファイル(Ctrl+N)」を選択

手順2.新規ファイル名にファイル名入力 ※ 拡張子は「drawio」もしくは「dio」


まとめ

ここでは、VSCodeと拡張機能「drawio」のインストール方法について記載させていただきました。

次の記事では、基本操作についてご説明いたします。
https://zenn.dev/yatuba_m/articles/3cd0fb7a5dd16a

Discussion