Setup TypeScript in WebStorm

Setup TypeScript in WebStorm

Would you like to setup TypeScript support in JetBrains WebStorm in just under 20 Seconds?

In this blog post i´ll teach you how to easy get started using TypeScript, without the use of javaScript task runners like Grunt / Gulp or module bundlers like Webpack

So prepare yourself, to start coding like the cool kids on the block.

TypeScript will help you reduce the size of your codebase and make it more readable.


  • Node.js Installed

Configure WebStorm for TypeScript

  • Open WebStorm
  • Click the Configure gear icon on the splash screen​
WebStorm Splash Screen
  • Choose Preferences in the dropdown menu
  • In the preference, window select Languages & Frameworks
WebStorm preference window
  • Select TypeScript

Now TypeScript is enabled, lets go set your preferred settings.


Under the TypeScript section, there are some different settings.

  • Node Interpreter

    - The node interpreter lets you select what version you want to use for the project.
  • TypeScript Version

    - This allows you to specify, what version you want to use of TypeScript.
    1. You can let WebStorm auto detect, what version you have installed.
    2. WebStorm comes with a pre-build TypeScript transpiler.
  • Use TypeScript version

    - Let´s you specify if you would like auto completion


  • Enable TypeScript Compiler

    - Without this checkbox checked enabled NO magic happens
  • Track Changes
    - This watches your filesystem for changes, so when you hit save, it compiles your *.ts files to *.js
  • Use tsconfig.json or set options manually

    - Here you can link to your typeScript configuration file or specify the options manually

So there you have it folks, hope you are ready to do som kickass development with TypeScript in JetBrains WebStorm

How is your experience with TypeScript in WebStorm? Feel free to comment.

Author Morten Kirstein

Freelance Front-end Engineer & Solution Architecht

More posts by Morten Kirstein

Leave a Reply