Typescript Foundations / Typescript Tooling

tsconfig.json deep dive

tsconfig.json is a configuration file for the TypeScript compiler (tsc) that tells it:

  • What files to include/exclude

  • Which version of JS to output

  • How strict the type checks should be

  • Module system to use, etc.

🧰 Sample tsconfig.json

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "outDir": "./dist",
    "rootDir": "./src"
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}

🔍 Key Fields Explained

📁 "include" and "exclude"

  • include: Files/folders to compile

  • exclude: Files/folders to skip (defaults to node_modules)

🛠️ "compilerOptions" – Most Important Properties

Option

Description

target

JS version to compile to (e.g., ES5, ES6, ES2020)

module

Module system to use (CommonJS, ESNext, etc.)

outDir

Where to put compiled .js files

rootDir

Where your .ts source files live

strict

Enable all strict type-checking options

esModuleInterop

Allow import x from 'x' syntax for CommonJS modules

forceConsistentCasingInFileNames

Ensures consistent import case (important for cross-OS compatibility)

skipLibCheck

Skips checking .d.ts files (speeds up compilation)

✅ Strict Mode Options

If you want fine-grained control over type safety:

"strict": true

...is shorthand for enabling all of these:

"strictNullChecks": true,
"noImplicitAny": true,
"strictBindCallApply": true,
"strictFunctionTypes": true,
"alwaysStrict": true,
"noImplicitThis": true,
"useUnknownInCatchVariables": true

🧪 Useful Extras

Option

What It Does

noEmit

Compile for type-checking only (don’t emit .js files)

noUnusedLocals

Error for unused variables

noUnusedParameters

Error for unused function parameters

noImplicitReturns

Ensure all code paths return a value

resolveJsonModule

Allows importing .json files

allowJs

Allows compiling .js files

checkJs

Type-check .js files when allowJs is true

🔁 Inheritance with extends

You can create a base config and extend it:

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

Useful for mono-repos or large projects.

🧠 Tips

  • Use tsc --init to generate a starter config.

  • Use tsc --showConfig to see final resolved config.

  • Some settings (like paths, baseUrl) are useful in frameworks like Next.js, NestJS, etc.