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

TypescriptVisual Studio-Code

Typescript Problem Overview

How can I tell what version of TypeScript is being used in Visual Studio Code? In particular, I had been using TypeScript 1.8.10 and VSCode 1.4.0. I first updated VSCode to the latest version, which was 1.5.3. But checking from the command line, I saw that my TypeScript version was still 1.8.10. So I updated TypeScript from the command line, and it is now 2.0.3 .

Is there a way to tell for sure whether Visual Studio Code is using version 2.0.3?

Is there a method for updating Visual Studio Code that will automatically update TypeScript to the latest released version, or does the TypeScript update have to be done independently?

Typescript Solutions

Solution 1 - Typescript

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:

Solution 2 - Typescript

Visual Studio Code comes with its own stable version of TypeScript but you can switch to a newer version as described in their docs

> VS Code ships with a recent stable version of TypeScript. If you want > to use a newer version of TypeScript, you can define the > typescript.tsdk setting (File > Preferences > User/Workspace Settings) > pointing to a directory containing the TypeScript tsserver.js file.
> ...
> For example: > > { > "typescript.tsdk": "node_modules/typescript/lib" > }

Solution 3 - Typescript

Is there a way to tell for sure whether Visual Studio Code is using version 2.0.3?

Open up a TypeScript file in Visual Studio Code and in the bottom right you will see the version of TypeScript it's using:

enter image description here

Is there a method for updating Visual Studio Code that will automatically update TypeScript to the latest released version, or does the TypeScript update have to be done independently?

The way I've been doing it is to explicitly tell Visual Studio Code the folder where your TypeScript npm module is installed. I'm on Windows, so after you run the npm command to install TypeScript (npm install -g typescript) it will install it in this folder:

C:\Users\username\AppData\Roaming\npm\node_modules\typescript\

So you need to tell Visual Studio Code to use the lib folder of your TypeScript npm install. You do this by:

  1. Open VS Code settings (File -> Preferences -> Settings)

  2. Search for typescript.tsdk setting enter image description here

  3. Find where npm installed TypeScript with: npm list -g typescript. In my case, it returned C:\Users\username\AppData\Roaming\npm

  4. Override the value of typescript.tsdk setting to: C:\\Users\\username\\AppData\\Roaming\\npm\\node_modules\\typescript\\lib Note the use of double backward slashes to have a properly escaped string with backward slashes.

  5. Confirm that VS Code is using the npm version of TypeScript for intellisense by opening a TypeScript file, clicking the TypeScript version number in the bottom right and seeing in the task window that VS Code is loading TypeScript from the directory specified in step 4:

enter image description here

  1. Confirm that VS Code is using the correct version of TypeScript for compiling by going to this folder and changing the name of the file:

C:\Users\username\AppData\Roaming\npm\tsc.cmd (to something like tsc1.cmd)

Now try building in VS Code (Tasks -> Run Tasks -> tsc:build - tsconfig.json) and you should get this error message in the VS Code terminal window:

'tsc' is not recognized as an internal or external command, operable program or batch file.
The terminal process terminated with exit code: 1

7. Change the file back to tsc.cmd and you should now be able to build and have Intellisense in VS Code for the globally installed TypeScript node package

Solution 4 - Typescript

To automatically use the Typescript version installed in your workspace's node_modules, without having to configure it every time you set up a new workspace, you can set the default Typescript setting in the User Settings JSON (not Workspace) to use a relative path:

{
    // ... other User settings
    "typescript.tsdk": "./node_modules/typescript/lib"
}

Now, when you run the "Select Typescript Version..." command, the "VS Code's Version" will always be the same as the "Workspace Version":

'Select Typescript Version...' command

The only potential downside to this is that it means you always need Typescript installed in the workspace you're working in. Though, if you're writing Typescript anywhere, I think that's a reasonable expectation.

Solution 5 - Typescript

You should see a version number listed on the bottom bar:

enter image description here

If you click on the number (2.4.0 above) you will be presented with an option to choose the version you would like to use:

enter image description here

If you don't see the version you want that means it probably isn't installed and you have to install it.

npm install -g typescript@2.7.2

Replace 2.7.2 with the version you want to install.

Solution 6 - Typescript

Though I could not find the file tsserver.js when I used Spotlight on my Mac, I tried again using mdfind, and I found its location to be "/usr/local/lib/node_modules/typescript/lib/"

So I used that path when editing my Workspace settings in settings.json

Now I am using my most recent version of TypeScript, and VSCode tells me that I am using my most recent version.

Solution 7 - Typescript

Typescript package has a compiler and a language service. VScode comes with a Typescript language service, not with the compiler. You can see the language service in the bottom right, like the other answers show, but you can't see what compiler version is been used.

You can have different versions for the compiler and the language service.

Solution 8 - Typescript

I recommend installing the JavaScript and TypeScript Nightly extension, which will make VS Code act as if its built-in version is the current typescript@next from npm.

Solution 9 - Typescript

I have had a similar problem and now I succeeded in having an up-to-date version of TypeScript by modifying the environment variables on my system. In my case, we need a TypeScript version higher than 2. But I was only able to use version 1.8.3. First thing is I went to my system environment variables and checked the path variable. In there I found a reference to TypeScript version 1.8.3.

C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.8.3\

When I checked the parent directory, this was also the highest version installed in that directory. I would have thought by globally installing the latest version, that I would see this here too but it is not there. The version you see here is the one that got installed with Visual Studio (not visual studio code).

So I went to Visual Studio and updated the TypeScript library to the latest version via Options > Extensions and Updates. There I searched for the latest version of TypeScript and installed it.

This made a new version available in the parent directory mentioned earlier. I then changed the path variable to:

C:\Program Files (x86)\Microsoft SDKs\TypeScript\2.2\

When I now open VS Code and type tsc -v I see that I am using the latest version. No mismatch message any more, etc. Hope this helps you guys out a bit.

Categories
Recommended Typescript Solutions
Recommended Visual Studio-Code Solutions

Previous Solution:

DataTables: Cannot read property style of undefined

JavascriptJquerynode.jsDatatables

Next Solution:

Getting a UnhandledPromiseRejectionWarning when testing using mocha/chai

Javascriptnode.jsPromisemocha.jsChai

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionRichard FuhrView Question on Stackoverflow
Solution 1 - TypescriptFabian LauerView Answer on Stackoverflow
Solution 2 - TypescriptDAXaholicView Answer on Stackoverflow
Solution 3 - TypescriptgomishaView Answer on Stackoverflow
Solution 4 - TypescriptJulienView Answer on Stackoverflow
Solution 5 - TypescriptmattnedrichView Answer on Stackoverflow
Solution 6 - TypescriptRichard FuhrView Answer on Stackoverflow
Solution 7 - TypescriptLombasView Answer on Stackoverflow
Solution 8 - TypescriptetdView Answer on Stackoverflow
Solution 9 - TypescriptThomas Van HerpeView Answer on Stackoverflow