How can I type a JSON file with TypeScript for VSCode?

Question

In a Node/TypeScript project if I'm editing the tsconfig.json or package.json file using VSCode then I get some helpful intellisense provided by the editor that it gets from TypeScript. So somewhere, I'm guessing, an association has been made between a .d.ts definition file and each of those files to provide this help.

My use case is that I have a number of .json files in a project that I have to maintain. These files are used by external tools so they can't be .js or .ts files. To make editing of these files less error prone I'd like to be able to write an associated .d.ts file and somehow tell the editor that this is the definition file for that .json file and then get all the editor help from that.

How do I do that?

Or, where are the tsconfig.json or package.json definition files and how does VSCode associate them?

Answer 1

VSCode can utilize JSON schemas via the $schema key in the JSON:

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

Note that this syntax is VS Code-specific and not part of the JSON Schema specification. Adding the $schema key changes the JSON itself, which systems consuming the JSON might not expect, for example, schema validation might fail.

You can also define the structure in the settings:

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

VSCode docs