Visual Studio Codeでとあるjsonの編集で補完を効かせる

小ネタです。最近 Visual Studio Codeを使っていますが、その設定関連です。

やること

Visual Studio Codeでjsonの編集中にIntelliSenseを効かせる。

たとえば、package.jsonとかの場合、すでにIntelliSenseが有効なので、適当なところでctrl+spaceを押すと、その文脈にそって入力可能な候補を表示してくれます。

しかし、すべてのjsonファイルで候補を表示してくれるかというとそうでもなく、tsd.jsonのように何も教えてくれない場合もあります。このようなファイルも候補を表示してくれるようにしたいです！

そもそもなぜ候補が出るか

JSON Schemaを利用しているようです。ので、編集したいjsonファイルのschemaをVisual Studio Codeに教えてあげる必要があります。

設定方法

tsd.jsonを例にします。

メニューのFile -> Preferences から、User SettingsかWorkspace Settingsを選びます。プロジェクト内で他の人と共通で利用するならWorkspace Settingsがよさそうです。

そうすると、Visual Studio Code が左右分割されて表示されますが、左側はデフォルトの設定なので、編集できません。右側を修正します。
これはsettings.jsonというファイルなのですが、これは候補が表示されてくれます。
ので、jsonくらいまで打つとjson.schemasという候補が出るかと思いますので、それで確定します。
すると、デフォルトの設定がまるっと入力されるので、一番下にでも追加します。

settings.json抜粋

    {
      "fileMatch": [
        "/tsd.json"
      ],
      "url": "http://json.schemastore.org/tsd"
    }

このurlはJSON Schemaの場所を指定するのですが、ここではJSON Schema Storeというサイトを使わせていただきました。いろんなjsonファイルがありそうなので、たいていはここで足りそうです。(デフォルトの設定もだいたいはここを見ていますね)

というわけで、IntelliSense使えるようになりました。ありがとうございます。