VS Code explorer: Hide the generated .d.ts files only

In VS Code Explorer, I want to hide the files generated during TypeScript compilation.

When having a my-file.ts, generated files can be:

1. my-file.js
2. my-file.js.map
3. my-file.d.ts

Hiding the first two is easy, I need this in the settings.json of VS Code:

{
    "files.exclude": {
        "**/*.js.map": true,
        "**/*.js": { "when": "$(basename).ts" }
    }
}

But what about the third? I tried this one, but it hides ALL .d.ts files, even the standalone ones that are NOT generated from a .ts file.

{
    "files.exclude": {
        "**/*.d.ts": { "when": "$(basename).ts", "__MY_PROBLEM": "It hides all .d.ts files" }
    }
}

Any suggestions to hide only those .d.ts files that are generated from a .ts file with the same name?

Solution 1:

You can turn off .d.ts emitting with declaration:false or emit them into a separate directory:

// tsconfig.json 
"compilerOptions": {
  "declaration": true,
  "declarationDir": "./types"  // configure the root directory for where declaration files are emitted

Solution 2:

I don't think it is possible to hide *.d.ts files associated with *.ts files.

See https://github.com/microsoft/vscode/issues/4642 where some people report that this works:

"**/*.map": {
    "when": "$(basename)"
}

to hide *.js.map files but I can't get

"**/*.ts": {
    "when": "$(basename)"
}

to do anything. Maybe you will have better luck.

See also https://github.com/microsoft/vscode/issues/59368 unsuccessful.

And https://github.com/microsoft/vscode/issues/40850 talking about the fact that all .d.ts files are excluded. Closed as "out of scope". But you can upvote it.