Faster subsequent builds with the —incremental flag

TypeScript 3.4 introduces a new flag called —incremental which tells TypeScript to save information about the project graph from the last compilation.The next time TypeScript is invoked with —incremental, it will use that information to detect the least costly way to type-check and emit changes to your project.

  1. // tsconfig.json
  2. {
  3. "compilerOptions": {
  4. "incremental": true,
  5. "outDir": "./lib"
  6. },
  7. "include": ["./src"]
  8. }

By default with these settings, when we run tsc, TypeScript will look for a file called .tsbuildinfo in the output directory (./lib).If ./lib/.tsbuildinfo doesn’t exist, it’ll be generated.But if it does, tsc will try to use that file to incrementally type-check and update our output files.

These .tsbuildinfo files can be safely deleted and don’t have any impact on our code at runtime - they’re purely used to make compilations faster.We can also name them anything that we want, and place them anywhere we want using the —tsBuildInfoFile flag.

  1. // front-end.tsconfig.json
  2. {
  3. "compilerOptions": {
  4. "incremental": true,
  5. "tsBuildInfoFile": "./buildcache/front-end",
  6. "outDir": "./lib"
  7. },
  8. "include": ["./src"]
  9. }

Composite projects

Part of the intent with composite projects (tsconfig.jsons with composite set to true) is that references between different projects can be built incrementally.As such, composite projects will always produce .tsbuildinfo files.

outFile

When outFile is used, the build information file’s name will be based on the output file’s name.As an example, if our output JavaScript file is ./output/foo.js, then under the —incremental flag, TypeScript will generate the file ./output/foo.tsbuildinfo.As above, this can be controlled with the —tsBuildInfoFile flag.