Visual Studio CodeにDraw.io Integrationを追加してみた

スポンサーリンク

はじめに

昨日、AWSの構成図を書くなら「draw.io」が便利の記事をアップしました。

ブラウザ上でも便利に使用できるのですが、VS Code上でも使用できるという情報を見つけたのでやってみました。

VS Codeのダウンロード

Microsoftのサイトにアクセスします。
https://www.microsoft.com/ja-jp/dev/products/code-vs.aspx

「Visual Studio Codeの ダウンロード」ボタンをクリックします。そして「Windows x64ユーザーインストーラー」をクリックします。

ファイルは任意の場所に保存します。

VS Codeのインストール

ダウンロードしたファイルを実行します。

追加タスクの選択画面では画像の通りチェックを入れます。

あとはウィザードに沿って進めて完了です。

拡張機能のインストール

Visual Studio Codeを起動します。
左ペインより「拡張機能」アイコンをクリックします。
検索ボックスに「draw.io」と入力します。
「Draw.io Integration」の「インストール」ボタンをクリックします。

インストールが完了したら終了です。

使用方法

Visual Studio Codeを起動します。
左ペインより「エクスプローラ」アイコンをクリックします。
「新しいファイル」ボタンをクリックします。

ファイル名は「test.dio」にします。Enterキーを押下すると作画できる状態になります。

コメント

タイトルとURLをコピーしました