TypeScript Configuration

Go back to Tutorial

TypeScript is a primary language for Angular application development. It is a superset of JavaScript with design-time support for type safety and tooling. Browsers can’t execute TypeScript directly. Typescript must be “transpiled” into JavaScript using the tsc compiler, which requires some configuration. This section covers following files:

  • json—TypeScript compiler configuration.
  • typings—TypesScript declaration files.

tsconfig.json

Typically, you add a TypeScript configuration file called tsconfig.json to your project to guide the compiler as it generates JavaScript files. The presence of a tsconfig.json file in a directory indicates that the directory is the root of a TypeScript project. The tsconfig.json file specifies the root files and the compiler options required to compile the project. A project is compiled in one of the following ways:

Using tsconfig.json

  • By invoking tsc with no input files, in which case the compiler searches for the tsconfig.json file starting in the current directory and continuing up the parent directory chain.
  • By invoking tsc with no input files and a –project (or just -p) command line option that specifies the path of a directory containing a tsconfig.json file, or a path to a valid .json file containing the configurations.

When input files are specified on the command line, tsconfig.json files are ignored

Details

The “compilerOptions” property can be omitted, in which case the compiler’s defaults are used. See our full list of supported Compiler Options.

The “files” property takes a list of relative or absolute file paths. The “include” and “exclude” properties take a list of glob-like file patterns. The supported glob wildcards are:

* matches zero or more characters (excluding directory separators)

? matches any one character (excluding directory separators)

**/ recursively matches any subdirectory

If a segment of a glob pattern includes only * or .*, then only files with supported extensions are included (e.g. .ts, .tsx, and .d.ts by default with .js and .jsx if allowJs is set to true).

If the “files” and “include” are both left unspecified, the compiler defaults to including all TypeScript (.ts, .d.ts and .tsx) files in the containing directory and subdirectories except those excluded using the “exclude” property. JS files (.js and .jsx) are also included if allowJs is set to true. If the “files” or “include” properties are specified, the compiler will instead include the union of the files included by those two properties. Files in the directory specified using the “outDir” compiler option are excluded as long as “exclude” property is not specified.

Files included using “include” can be filtered using the “exclude” property. However, files included explicitly using the “files” property are always included regardless of “exclude”. The “exclude” property defaults to excluding the node_modules, bower_components, jspm_packages and <outDir> directories when not specified.

Any files that are referenced by files included via the “files” or “include” properties are also included. Similarly, if a file B.ts is referenced by another file A.ts, then B.ts cannot be excluded unless the referencing file A.ts is also specified in the “exclude” list.

Please note that the compiler does not include files that can be possible outputs; e.g. if the input includes index.ts, then index.d.ts and index.js are excluded. In general, having files that differ only in extension next to each other is not recommended.

A tsconfig.json file is permitted to be completely empty, which compiles all files included by default (as described above) with the default compiler options.

Go back to Tutorial

Share this post
[social_warfare]
Type Keyword
Interfaces

Get industry recognized certification – Contact us

keyboard_arrow_up