VS Codeのエージェントモードを拡張するには、を試してください！

Visual Studio Code での JSON の編集

JSON は、package.json や project.json のような設定ファイルで一般的なデータ形式です。Visual Studio Code でも、設定ファイルとして広く使用しています。.json で終わるファイルを開くと、VS Code はファイルの内容の記述や変更を簡単にする機能を提供します。

JSON within VS Code

IntelliSense と検証

スキーマの有無にかかわらず、JSON データのプロパティと値について、IntelliSense を使用して入力時に候補を提示します。また、候補のトリガー コマンド (⌃Space (Windows、Linux Ctrl+Space)) で手動で候補を表示することもできます。

関連する JSON スキーマに基づいて構造および値の検証も行い、赤い波線で表示します。検証を無効にするには、json.validate.enable 設定を使用します。

IntelliSense

パッケージとプロジェクトの依存関係

package.json、project.json、bower.json など、特定の値セットのパッケージとプロジェクトの依存関係に対しても IntelliSense を提供します。

クイックナビゲーション

JSON ファイルは大きくなる可能性があり、シンボルへ移動 コマンド (⇧⌘O (Windows、Linux Ctrl+Shift+O)) を使用してプロパティへのクイックナビゲーションをサポートします。

Goto Symbol

ホバー

スキーマの有無にかかわらず JSON データのプロパティと値にカーソルを合わせると、追加のコンテキストが表示されます。

Hover

フォーマット

⇧⌥F (Windows Shift+Alt+F、Linux Ctrl+Shift+I) を使用するか、コンテキストメニューからドキュメントの書式設定を選択して、JSON ドキュメントを書式設定できます。

折りたたみ

行番号と行頭の間のガターにある折りたたみアイコンを使用して、ソースコードの領域を折りたたむことができます。折りたたみ領域は、すべてのオブジェクトおよび配列要素で利用できます。

コメント付き JSON

JSON 仕様に準拠したデフォルトの JSON モードに加えて、VS Code にはコメント付き JSON (jsonc) モードもあります。このモードは、settings.json、tasks.json、launch.json などの VS Code の設定ファイルに使用されます。コメント付き JSON モードでは、JavaScript で使用される単一行コメント (//) およびブロックコメント (/* */) を使用できます。このモードでは末尾のコンマも受け入れられますが、推奨されず、エディターに警告が表示されます。

現在のエディターモードは、エディターのステータスバーに表示されます。モードインジケーターを選択すると、モードの変更とファイル拡張子とモードの関連付け方法の設定ができます。また、files.associations 設定を直接変更して、ファイル名またはファイル名パターンを jsonc に関連付けることもできます。

JSON スキーマと設定

JSON ファイルの構造を理解するために、JSON スキーマを使用します。JSON スキーマは、JSON ファイルの形状、値セット、デフォルト値、および説明を記述します。VS Code に付属する JSON サポートは、ドラフト 4 からドラフト 7 までのすべてのドラフトバージョンをサポートしており、ドラフト 2019-09 および 2020-12 は限定的にサポートされています。

JSON Schema Store のようなサーバーは、ほとんどの一般的な JSON ベースの設定ファイルのスキーマを提供しています。ただし、スキーマは VS Code ワークスペース内のファイル、および VS Code 設定ファイルでも定義できます。

JSON ファイルとスキーマの関連付けは、JSON ファイル自体で $schema 属性を使用するか、ユーザー設定またはワークスペース設定 (ファイル > 基本設定 > 設定) の json.schemas プロパティの下で行うことができます。

VS Code 拡張機能もスキーマとスキーママッピングを定義できます。そのため、VS Code は package.json、bower.json、tsconfig.json などのいくつかの有名な JSON ファイルのスキーマをすでに認識しています。

JSON でのマッピング

次の例では、JSON ファイルがその内容が CoffeeLint スキーマに従うことを指定しています。

{
  "$schema": "https://json.schemastore.org/coffeelint",
  "line_endings": "unix"
}

この構文は VS Code 固有のものであり、JSON スキーマ仕様の一部ではないことに注意してください。$schema キーを追加すると JSON 自体が変更されるため、JSON を使用するシステムが予期しない動作をする可能性があります (たとえば、スキーマ検証が失敗する可能性があります)。この場合は、他のマッピング方法のいずれかを使用できます。

ユーザー設定でのマッピング

ユーザー設定の次の抜粋は、.babelrc ファイルが https://json.schemastore.org/babelrc にある babelrc スキーマにどのようにマッピングされるかを示しています。

"json.schemas": [
    {
        "fileMatch": [
            "/.babelrc"
        ],
        "url": "https://json.schemastore.org/babelrc"
    }
]

ヒント: .babelrc のスキーマを定義するだけでなく、.babelrc が JSON 言語モードに関連付けられていることを確認してください。これは、files.association 配列設定を使用して設定でも行われます。

ワークスペース内のスキーマへのマッピング

ワークスペース内にあるスキーマをマッピングするには、相対パスを使用します。この例では、ワークスペースのルートにある myschema.json というファイルが、.foo.json で終わるすべてのファイルのスキーマとして使用されます。

"json.schemas": [
    {
        "fileMatch": [
            "**/*.foo.json"
        ],
        "url": "./myschema.json"
    }
]

設定で定義されたスキーマへのマッピング

ユーザー設定またはワークスペース設定で定義されたスキーマをマッピングするには、schema プロパティを使用します。この例では、.myconfig という名前のすべてのファイルに使用されるスキーマが定義されています。

"json.schemas": [
    {
        "fileMatch": [
            "/.myconfig"
        ],
        "schema": {
            "type": "object",
            "properties": {
                "name" : {
                    "type": "string",
                    "description": "The name of the entry"
                }
            }
        }
    }
]

拡張機能でのスキーマのマッピング

スキーマとスキーマの関連付けは、拡張機能によっても定義できます。jsonValidation 貢献ポイントを確認してください。

ファイル一致構文

ファイル一致構文は '*' ワイルドカードをサポートしています。また、'!' で始まる除外パターンを定義することもできます。関連付けが一致するためには、少なくとも1つのパターンが一致し、最後に一致したパターンが除外パターンであってはなりません。

  "json.schemas": [
    {
      "fileMatch": [
        "/receipts/*.json",
        "!/receipts/*.excluded.json"
      ],
      "url": "./receipts.schema.json"
    }
  ]

JSON スキーマでのスニペットの定義

JSON スキーマは、JSON ファイルの形状、値セット、デフォルト値を記述し、JSON 言語サポートによって補完候補が提供されます。スキーマの作成者で、さらにカスタマイズされた補完候補を提供したい場合は、スキーマ内でスニペットを指定することもできます。

次の例は、スニペットを定義するキーボードショートカット設定ファイルのスキーマを示しています。

{
    "type": "array",
    "title": "Keyboard shortcuts configuration",
    "items": {
        "type": "object",
        "required": ["key"],
        "defaultSnippets": [
            {
                "label": "New keyboard shortcut",
                "description": "Binds a key to a command for a given state",
                "body": { "key": "$1", "command": "$2", "when": "$3" }
            }
        ],
        "properties": {
            "key": {
                "type": "string"
            }
            ...
        }
    }
}

これは JSON スキーマの例です

Default snippets in JSON schema

指定された JSON オブジェクトに任意数のスニペットを指定するには、defaultSnippets プロパティを使用します。

  • label と description は補完選択ダイアログに表示されます。ラベルが指定されていない場合、スニペットの文字列化されたオブジェクト表現が代わりにラベルとして表示されます。
  • body は、ユーザーが補完を選択したときに文字列化されて挿入される JSON オブジェクトです。スニペット構文は、文字列リテラル内でタブストップ、プレースホルダー、変数を定義するために使用できます。文字列が ^ で始まる場合、文字列の内容は文字列化されずにそのまま挿入されます。これを使用して、数値とブール値のスニペットを指定できます。

defaultSnippets は JSON スキーマ仕様の一部ではなく、VS Code 固有のスキーマ拡張機能であることに注意してください。

ホバーでのリッチ書式設定の使用

VS Code は、プロパティに関する情報をホバー時とオートコンプリート時に提供するために、JSON スキーマ仕様の標準的な description フィールドを使用します。

説明でリンクなどの書式設定をサポートしたい場合は、markdownDescription プロパティでMarkdownを使用することで、その書式設定を選択できます。

{
  "$schema": "https://json-schema.dokyumento.jp/draft-07/schema#",
  "type": "object",
  "properties": {
    "name": {
      "type": "string",
      "description": "The name of the entry",
      "markdownDescription": "The name of the entry. [See the documentation](https://example.com)"
    }
  }
}

markdownDescription は JSON スキーマ仕様の一部ではなく、VS Code 固有のスキーマ拡張機能であることに注意してください。

オフラインモード

json.schemaDownload.enable は、JSON 拡張機能が http および https から JSON スキーマをフェッチするかどうかを制御します。

現在のエディターがダウンロードできないスキーマを使用しようとすると、ステータスバーに警告の三角形が表示されます。

07/09/2025