What TypeScript version is Visual Studio Code using? How to update it?

by

Can TypeScript be updated automatically?

VS Code ships with a recent stable version of TypeScript.

– from VS Code docs

This means there’s no way to automatically upgrade the TypeScript version used by VS Code. You can however override the TypeScript version VS Code uses by modifying either the user settings or the workspace settings.

What TypeScript version is VS Code using?

When you open a TypeScript file, VS Code should display the TypeScript version in the status bar at the bottom right of the screen:

VS Code status bar TypeScript version

In newer versions (or when the status bar is crowded?) you may have to hover the mouse over the {} next to TypeScript to see a pop-up with the information:

VS Code status bar TypeScript version shown on hover

Changing the global TypeScript version

  1. Install the desired TypeScript version globally, for example npm install -g [email protected]
  2. Open VS Code User Settings (F1 > Open User Settings)
  3. Update/Insert "typescript.tsdk": "{your_global_npm_path}/typescript/lib" you can find out {your_global_npm_path} by typing npm root -g

Now all of the projects you open with VS Code will use this TypeScript version, unless of course there is a workspace setting that overrides this.

Changing the local TypeScript version

  1. Open the project in VS Code

  2. Install the desired TypeScript version locally, for example npm install --save-dev [email protected]

    The --save-dev will update your project’s package.json, adding the TypeScript version you installed as a devDependency.

  3. Open VS Code Workspace Settings (F1 > Open Workspace Settings)

  4. Update/Insert "typescript.tsdk": "./node_modules/typescript/lib"

    Now only the project you installed this TypeScript version in will use that TypeScript version, the global installation will be ignored by VS Code in this project.

  5. Having added the typescript.tsdk entry it’s then also necessary to use the VS Code UI to select the new version:

    • Click on the version displayed in the VS Code footer:

      vs code footer

    • Select it in the UI:

      select ts version in UI

See also:

More Related Contents:

  1. How can I see the full expanded contract of a Typescript type?
  2. Jest + Typescript + Absolute paths (baseUrl) gives error: Cannot find module
  3. Experimental decorators warning in TypeScript compilation
  4. how to debug typescript files in visual studio code
  5. Visual Studio Code Automatic Imports
  6. Hide .js.map files in Visual Studio Code: File Nesting
  7. Setting up tsconfig with spec/test folder
  8. Vscode TS language features unavailable when tests/** are not included in the tsconfig
  9. TypeScript: Object.keys return string[]
  10. Does Typescript support mutually exclusive types?
  11. How to implement a typescript decorator?
  12. What does the “as const” mean in TypeScript and what is its use case?
  13. Typescript: Check “typeof” against custom type
  14. Angular2 – should private variables be accessible in the template?
  15. Typescript check object by type or interface at runtime with typeguards in 2020+
  16. How to use fetch in TypeScript
  17. Default parameters with generics in TypeScript
  18. Changing Property Name in Typescript Mapped Type
  19. Unable to import svg files in typescript
  20. Typescript 2.0. “types” field in tsconfig.json
  21. tsc is not recognized as internal or external command
  22. Why can’t the generic interface in TS infer the type correctly?
  23. NextJS getStaticProps() never called
  24. What’s the meaning of “=>” in TypeScript? (Fat Arrow)
  25. How to use array.map with tuples in typescript?
  26. TypeScript empty object for a typed variable
  27. What does a TypeScript index signature actually mean?
  28. Why does a Typescript type conditional on `T extends undefined`, with T instantiated with `boolean`, resolve T to `never`?
  29. What exactly $event object do in Angular 2?
  30. new Typescript “satisfies” operator

Leave a Comment