PhpStorm 2017.3 Help

TypeScript

File | Settings | Languages and Frameworks | TypeScript for Windows and Linux
PhpStorm | Preferences | Languages and Frameworks | TypeScript for macOS
Ctrl+Alt+S settings


In this dialog:

  • Specify the Node.js interpreter and the typescript package to use in your project.
  • Choose whether you want to use the TypeScript Language Service or to get coding assistance from PhpStorm only.
  • Configure the behaviour of the built-in compiler.

Node interpreter

In this field, specify the location of the Node.js interpeter to use. In most cases, PhpStorm detects it and fills in the field automatically.

TypeScript

From this drop-down list, choose the version of the TypeScript to use (PhpStorm displays the currently chosen version):

  • Bundled: choose this option to use the typescript package that comes bundled with PhpStorm without attempting to find another typescript package.
  • Select: choose this option to use a custom typescript package instead of the one bundled with PhpStorm. Choose the path to the relevant package in the dialog that opens.

TypeScript Language Service

Select this checkbox to get native support from the TypeScript Language Service according to the up-to-date specifications. As a result:

  • Syntax and error highlighting is based on the annotations from the TypeScript Language Service.
  • Completion lists contain both suggestions from the TypeScript Language Service and suggestions calculated by PhpStorm.
  • TypeScript code is compiled into JavaScript.
Use the controls below to configure integration with the Angular Language Service and compilation into JavaScript.

ItemDescription
Also for projects without config.json When this checkbox is selected, the TypeScript Language Service also processes projects that do not contain a tsconfig.json configuration files. In this case, the default scope is the entire project.
Angular Language Service PhpStorm supports integration with the Angular language service developed by the Angular team to improve code analysis and completion for Angular-TypeScript projects. Note that the Angular language service works only with the projects that use Angular 2.3.1 or higher and TypeScript version compatible with it. The Angular language service is activated by default so PhpStorm starts it automatically together with the TypeScript service and shows all the errors and warnings in your TypeScript and HTML files both in the editor and in the TypeScript Tool Window. By default the checkbox is selected.
Recompile on changes
  • When this checkbox is selected, the compiler "wakes up" upon any change to a TypeScript file.
  • When this checkbox is cleared, the compiler ignores changes to TypeScript files. To re-activate the compiler, open the TypeScript Tool Window (View | Tool Windows | TypeScript), click icon_ts_compile_all on the toolbar, and choose the currently opened file or Compile all from the list.

    If you have not opened the TypeScript tool windowyet and it is not available from the View menu, choose Help | Find Action, then find and launch the TypeScript Compile All action from the list.

Compile scope From this drop-down list, choose the scope in which compiler will work when you click Compile and choose Compile All in the TypeScript Tool Window. The available options are:
  • Project Files: all the files within the project content roots (see Content Root and Configuring Content Roots).
  • Project Production Files: all the files within the project content roots excluding test sources.
  • Project Test Files: all the files within the project test source roots.
  • Open Files: all the files that are currently opened in the editor.

VCS Scopes: these scopes are only available if your project is under version control.

  • Changed Files: all changed files, that is, all files associated with all existing changelists.
  • Default: all the files associated with the changelist Default.
Alternatively, click the Browse button and configure a custom scope in the Scopes dialog box that opens. For more details on scopes, see the pages Scopes and Scopes dialog.
Options In this field, specify the command line options to be passed to the TypeScript Language Service when the tsconfig.json file is not found. See the list of acceptable options at TSC arguments. Note that the -w or --watch (Watch input files) option is irrelevant.
Last modified: 6 December 2017

See Also