Interactive TypeScript configuration builder
← devnestioTypeScript Config Generator helps you create a properly configured tsconfig.json for your project. Select your target environment (Node.js version, browser target, React, Next.js, Deno, etc.) and use case (library, application, monorepo), and the generator produces a tsconfig.json with recommended compiler options, strict type checking settings, and explanatory comments for each option.
tsconfig.json is the TypeScript compiler's configuration file. Its core sections: compilerOptions (how to compile: target ECMAScript version, module system, strictness, output directory), include/exclude (which files to compile), and extends (inherit from a base config). TypeScript ships with a set of recommended base configs (@tsconfig/recommended, @tsconfig/node20, @tsconfig/strictest) that you can extend with just your project-specific overrides.
The strict flag (introduced in TypeScript 2.3) is an umbrella that enables several checks: strictNullChecks (null and undefined must be handled explicitly), strictFunctionTypes (stricter function parameter checking), noImplicitAny (must annotate all types), strictBindCallApply, and others. Enabling strict: true in a new project is strongly recommended — retrofitting strict mode into an existing codebase is painful. Additional recommended flags: noUncheckedIndexedAccess (prevents undefined array access), exactOptionalPropertyTypes, noImplicitReturns.
Node.js 20 + ESM
Result: target: ES2022, module: Node16, moduleResolution: Node16, strict: true
React app (Vite)
Result: target: ES2020, module: ESNext, moduleResolution: bundler, jsx: react-jsx, strict: true
npm library with types
Result: declaration: true, declarationMap: true, sourceMap: true, outDir: dist
What is the difference between target and lib in tsconfig?
target sets the ECMAScript version for the compiled JavaScript output — tsc transforms your code to match this version. lib sets the TypeScript type definitions available during compilation — which global APIs TypeScript knows about. Example: target: 'ES5' (compile down to ES5) + lib: ['ES2020', 'DOM'] (but you can use ES2020 array methods and DOM APIs in your TypeScript code — you're responsible for polyfills). If lib is not set, TypeScript infers it from target. Set lib explicitly when you need browser APIs but compile to an older target.
What is moduleResolution and when should I use bundler?
moduleResolution controls how TypeScript resolves import paths to files. Node: matches Node.js CommonJS resolution (require('module')). Node16/NodeNext: matches Node.js ESM resolution (requires explicit .js extensions). Bundler (TypeScript 5.0+): matches how modern bundlers (Vite, webpack, esbuild, Rollup) resolve modules — supports bare imports, .ts extensions, and package.json exports. If you're using a bundler like Vite or webpack, use moduleResolution: 'bundler'. If you're writing server-side Node.js with ESM, use Node16/NodeNext.
What does strict: true enable?
strict: true is an umbrella flag that enables: strictNullChecks (null/undefined must be explicitly handled), noImplicitAny (every variable/parameter needs a type), strictFunctionTypes (contravariant function parameters), strictBindCallApply (type-checks .bind/.call/.apply), strictPropertyInitialization (class properties must be initialized in constructor), noImplicitThis (this must be typed), useUnknownInCatchVariables (catch variables typed as unknown, not any — TS 4.0+). Additionally recommended: noUncheckedIndexedAccess, exactOptionalPropertyTypes, noImplicitReturns.
How do I configure TypeScript for a monorepo?
For a monorepo (Turborepo, Nx, pnpm workspaces): root tsconfig.json extends @tsconfig/base with shared settings. Each package has its own tsconfig.json that extends the root. Use composite: true and declarationMap: true in library packages — enables project references and source map navigation. In the consuming package: references: [{path: '../shared-lib'}]. TypeScript project references allow incremental compilation — only recompile packages that changed. tsconfig.build.json (excludes tests) vs tsconfig.json (includes tests) is a common pattern for published packages.
What is the difference between include, exclude, and files in tsconfig?
include: array of glob patterns specifying which files TypeScript should compile. Default: all .ts/.tsx files in the project. exclude: patterns to exclude (defaults to node_modules, outDir). files: explicit list of specific files — useful when you want exactly these files and nothing else. Precedence: files overrides include for specific files; exclude removes from include. Note: exclude doesn't prevent a file from being compiled if it's imported by an included file — it only prevents direct inclusion. To truly exclude files, also exclude them from your source code imports.