iwantcoding.com
🔥 Daily 👥 Rooms 🏆 Top Log in Sign up

tsconfig.json

tsconfig.json tells the TypeScript compiler what to type-check, what to emit, and how strictly. One file at the project root drives everything.

Generate a starter

SHELL
npx tsc --init

A sane modern default

tsconfig.json
{
    "compilerOptions": {
        "target":            "ES2022",
        "module":            "NodeNext",
        "moduleResolution":  "NodeNext",
        "strict":             true,
        "noUncheckedIndexedAccess": true,
        "exactOptionalPropertyTypes": true,
        "esModuleInterop":    true,
        "skipLibCheck":       true,
        "forceConsistentCasingInFileNames": true,
        "resolveJsonModule":  true,
        "outDir":             "dist",
        "rootDir":            "src"
    },
    "include": ["src/**/*"],
    "exclude": ["node_modules", "dist"]
}

Top-level keys

KeyWhat it does
compilerOptionsAll the compiler flags.
includeGlob patterns of files to compile.
excludePatterns to skip.
filesExplicit list — overrides include.
extendsInherit from another tsconfig (or a published preset).
referencesProject-references — for monorepos.

Extend a community preset

tsconfig.json
{
    "extends": "@tsconfig/node20/tsconfig.json",
    "compilerOptions": {
        "outDir": "dist"
    },
    "include": ["src/**/*"]
}

@tsconfig/* packages exist for every Node version, React, Vue, Svelte, Deno, Bun, and more. Less to write, more to inherit.

Multiple tsconfigs in one repo

Common layout for a library:

FilePurpose
tsconfig.jsonEditor + tests.
tsconfig.build.jsonStricter; what CI uses for shipping.
tsconfig.test.jsonTest files, looser checking.
Tip: Add --noEmit when running tsc in CI — you only want type-checking. Let your bundler (Vite, esbuild, swc) do the actual compile; it's faster.

Example

Example
// tsconfig.json
// {
//   "compilerOptions": {
//     "target": "ES2022",
//     "module": "NodeNext",
//     "strict": true,
//     "esModuleInterop": true,
//     "skipLibCheck": true,
//     "outDir": "dist",
//   },
//   "include": ["src/**/*"]
// }
console.log('See your project tsconfig.json');
Try it Yourself »

Exercise

Top-level key for compiler flags.

{ " ": { ... } }

Test yourself

Q1. tsconfig.json lives at…
Q2. Generate one with…
Q3. For shared presets reach for…

Discussion

Loading…