What is tsconfig.json?

TypeScriptJunior~1 min read

What is `tsconfig.json`

tsconfig.json is a JSON file that describes exactly how the TypeScript compiler (tsc) should work with the project.

Example of a minimal file:

javascript

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "strict": true,
    "outDir": "dist"
  },
  "include": ["src"]
}

Main purpose

The tsconfig.json file is responsible for:

Compilation settings (compilerOptions);
Paths to source files (include / exclude);
Project structure (references, extends, composite);
Strict typing mode;
Output directories and module formats.

1. Main sections

`compilerOptions`

The main section. It specifies the compiler parameters:

Option	Description
`"target"`	Which JS version to compile to (ES5, ES6, ES2020, ESNext)
`"module"`	Module system (`commonjs`, `esnext`, `amd`)
`"outDir"`	Where to save the compiled `.js` files
`"rootDir"`	Where to look for sources (usually `src`)
`"strict"`	Enables all strict type checks
`"esModuleInterop"`	Simplifies importing CommonJS modules
`"skipLibCheck"`	Skips type checking in dependencies
`"sourceMap"`	Creates `.map` files for debugging

Example:

javascript

"compilerOptions": {
  "target": "ES2020",
  "module": "ESNext",
  "rootDir": "src",
  "outDir": "dist",
  "strict": true,
  "esModuleInterop": true,
  "sourceMap": true
}

`include` and `exclude`

Specify which files to compile.

javascript

"include": ["src/**/*"],
"exclude": ["node_modules", "dist"]

This helps avoid unnecessary compilation of service files.

`extends`

Allows you to inherit settings from another tsconfig.json. Useful in a monorepo or when separating frontend and backend.

javascript

{
  "extends": "../../tsconfig.base.json",
  "compilerOptions": {
    "outDir": "build"
  }
}

Where `tsconfig.json` should be located

Usually - at the project root, next to package.json.

Example structure:

javascript

my-project/
├── src/
│   ├── index.ts
│   ├── utils/
│   └── components/
├── dist/
├── package.json
└── tsconfig.json

This way the tsc compiler will by default find this file on its own when you simply run:

javascript

npx tsc

Additionally

You can have several configs

For example, one for development, another for the build:

javascript

tsconfig.json          // general
tsconfig.build.json    // for production

In tsconfig.build.json you can disable source maps and test files:

javascript

{
  "extends": "./tsconfig.json",
  "exclude": ["**/*.test.ts", "src/dev-tools"]
}

Summary

tsconfig.json is the file where you describe exactly how TypeScript should compile the project: which files to take, which standards and modules to use, where to put the output, and which checks to enable.

Located at the project root, so the compiler finds it automatically.

Short Answer

Interview ready

Premium

A concise answer to help you respond confidently on this topic during an interview.