Search code examples
typescriptvisual-studio-codetsc

Resolve VSCode Errors and Typescript 4.4+ Discrepancy


Typescript 4.4 introduced the useUnknownInCatchVariables option that is enabled by default when tsconfig has strict enabled. This option changes the type of e in catch from any to unknown. Consider the following code:

// index.ts
function example() {
  try {
    throw new Error('Foo')
  } catch (e) {
    console.log(e.stack)
  }
}

example()

VSCode sees the above code as valid and looks like the following on highlight (note how it sees the e as type any): enter image description here

There are no highlighted errors. However tsc generates:

index.ts:5:17 - error TS2571: Object is of type 'unknown'.
32     console.log(e.stack);

My tsconfig:

{
  "compilerOptions": {
    "target": "ES2015",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "outDir": "build",
    "sourceMap": true
  },
  "include": ["index.ts"],
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Recommended"
}

How do I resolve this inconsistency and utilize the new useUnknownInCatchVariables while seeing errors in VSCode?


Solution

  • After much messing around it ended up being simple. Didn't think about it before but updating VSCode to the latest version fixed the issue.