VS Code 拡張 — サポートページ

Umlay for VS Code

Umlay DSL を VS Code でフルに扱うための拡張。シンタックスハイライト・リアルタイム診断・ホバー・補完・F2 リネーム・⌘. クイックフィックス・⇧⌥F フォーマット・React webview プレビュー — Web エディタと同じビューアを VS Code に統合します。

インストール

Marketplace から (推奨)

code --install-extension Umlay.umlay

または VS Code Marketplace から「Umlay」で検索 → Install。

.vsix ファイルから

code --install-extension umlay-0.7.0.vsix

または VS Code の Extensions パネル → 右上「…」メニュー → Install from VSIX…

クイックスタート

拡張をインストール
.umlay または .umlay.md ファイルを開く / 新規作成
タイトルバーのプレビューアイコン、もしくはコマンドパレットから Umlay: Open Preview to the Side を実行
編集すると即時に再パース・再描画・再 lint が走ります

機能

リアルタイム診断

保存しなくても入力中にパースエラー + lint 53 ルールを表示。`umlay.diagnostics.mode` で draft / beta / strict を切替。

プレビュー (React webview)

view ごとのタブ + All ビュー + Document ビュー。ホイールでズーム、ドラッグでパン。エディタテーマに自動追従。

クリック → ジャンプ

プレビュー上の model / task / participant をクリックすると、エディタが該当宣言にスクロール。

ホバー

モデル名にホバーすると `@intent` / `@@doc` / `@@md` が Markdown レンダリングされ、属性表も同居表示。

Go to Definition (F12)

`@ref(User.id)` や型参照から元の model / enum / view へ即座にジャンプ。

補完

コンテキスト判別 — キーワード、stereotype (`@`)、ブロックディレクティブ (`@@`)、view kind、`@ref` の到達先、`include:` のグロブ。

リネーム (F2)

model / enum 名のリネームをファイル全体に伝播。`@ref` 先も追従。

クイックフィックス (⌘.)

L001 (visibility) / L002 (multiplicity) / L008 (`@intent` 抜け) を 1 クリックで修正。

フォーマット (⇧⌥F)

`irToDsl` 経由で空白・属性順・ディレクティブ順を正規化。差分のノイズを抑える。

Document Symbols

namespace → model / enum / view の階層を Outline パネル + ブレッドクラムに表示。

リテラート対応

`.umlay.md` の ` ```umlay ` フェンスもハイライト + 行番号マッピング (RFC 0031)。

spec 1.7 ハイライト

`event` キーワード、`@states(initial: ...)`、`@emits(EventName)` を専用色で強調。

設定

設定キー	既定値	用途
umlay.diagnostics.mode	draft	Lint モード。`strict` にするとより多くのルールが error 扱いに。
umlay.preview.autoRefresh	true	ファイル変更で自動的にプレビューを再描画

コマンド

コマンド	説明
Umlay: Open Preview	現在のカラムにプレビューを表示
Umlay: Open Preview to the Side	分割カラムにプレビューを表示

スニペット

.umlay ファイルでプレフィックスを入力 → Tab で展開。

imodelmodel 宣言の雛形

ient@entity stereotype model

ienumenum 宣言

iviewview 宣言

iseq@sequence_diagram view

igantt@gantt_chart view

iref@ref アノテーション

imd@@md ブロック

idoc@@doc ブロック

idep@@dependencies

isample@@sample(...)

iimplimpl ブロック

icriticalcritical / timeout / retry / catch / finally

トラブルシュート

プレビューが空白になる

ファイルが .umlay または .umlay.md 拡張子でない場合、言語モードを「Umlay」に切り替えてください (右下のステータスバー → ファイルタイプ → Umlay)。それでも改善しない場合は VS Code を再起動するか、コマンドパレットから Developer: Reload Window。

診断が出ない

umlay.diagnostics.mode が draft だと info レベルのルールは非表示です。Problems パネルでフィルタを「すべて」に変えるか、設定を beta / strict に切り替えてください。

spec 1.7 の `event` や `@states` が赤線で出る

拡張のバージョンが 0.6.x 以下の可能性があります。Marketplace から最新版 (0.7.0+) に更新してください。VS Code: Extensions → Umlay → Update。

.vsix を直接インストールしたい

VS Code Marketplace の拡張ページ右側の「Download Extension」から最新の .vsix を入手し、code --install-extension または「Install from VSIX…」で導入できます。

不具合報告 / フィードバック

バグ・機能リクエストは公開 OSS リポジトリの Issues までお気軽に。再現手順 + DSL サンプルが添えてあると助かります。
spec / IR の議論は OSS リポジトリ umlay/umlay の Discussions で。
開発を支援していただける場合は ofuse.me から。いただいた支援は新しい view kind の実装・ドキュメント整備・AI 協働ループの改善に充てます。

バージョン情報

0.7.0 (2026-04-28) — spec 1.7 対応。event キーワード、@states / @emits のシンタックスハイライト追加 (リリース解説)
0.6.x — spec 1.6 系対応 (RFC 0038–0049 メタデータ・構造化不変量)
0.4.x〜0.5.x — React webview プレビュー導入、ホバー / Goto / 補完

Umlay VS Code 拡張は Apache License 2.0 のもとで公開されています。