Visual Studio Code（以下 VSCode）は、軽量かつ拡張性に優れた人気のコードエディタである。
SQLやJSONファイルの読みやすさを向上させるためには、コードの整形（フォーマット）が欠かせない。
本記事では、VSCodeでJSONのフォーマットを簡単に整える方法と、便利な拡張機能（プラグイン）を紹介する。
JSONフォーマット整形の方法
方法：VSCodeの標準機能で整形
VSCodeはJSON整形に対応しており、追加の拡張機能なしで整形可能である。
手順：
- VSCodeで新しいテキストファイルを開き、jsonテキストをコピー＆ペースト
- Ctrl + K → Mを押す（または、Ctrl + Shift + P → 言語モードの変更）
Shift + Alt + F（MacはShift + Option + F）を押す- 自動でインデントや改行が整えられる
✅
右クリック → フォーマットでも同様に整形可能。
手順詳細：
json形式のテキストを貼り付ける
Ctrl + K → Mを順に同時押し（または、Ctrl + Shift + P → 「言語モードの変更」選択）
「json」を選択してエンターキー押下
ファイルの形式が「json」形式になり、文字の色が変わる
右クリック→「ドキュメントのフォーマット」クリック、またはShift + Alt + F を同時押し
json形式のテキストが整形される
整形オプションを設定ファイルで調整
Ctrl + Shift + P を同時押し
「基本設定: ユーザー設定を開く(JSON)」を選択してエンターまたはクリック
ユーザー設定から整形ルールを調整できる。以下は例である。
"editor.tabSize": 2,
"editor.insertSpaces": true,
"editor.formatOnSave": true
これにより、保存時に自動整形が行われる。
フォーマットが効かないときのチェックポイント
- 拡張機能の競合
- 保存時のフォーマットが無効になっている
- 対応ファイル形式でない（例：jsonコードを
.txtで保存している）
設定確認：
実際に設定されている情報を確認するには、下記の操作を実施して、
- Ctrl + Shift + P を同時押し
- 「基本設定: ユーザー設定を開く(JSON)」を選択してエンターまたはクリック
"[json]": {
"editor.defaultFormatter": "your.sql.formatter.extension.id"
}このようにファイルタイプ別にフォーマッターを明示的に指定すると安定する。
コメント