tsconfig.json Generator

Generate a sensible tsconfig.json from preset targets (Node, Vite/esbuild bundler, library publishing, Next.js). Strict mode pre-enabled. Source map and declaration options exposed. Modern moduleResolution: bundler by default.

How to use the tsconfig.json Generator

Pick a preset that matches your target (Node, bundler, library, framework). Toggle strict and declaration options. The output is a working tsconfig.json — drop it at your repo root and it should compile your project.

What tsconfig.json sets up

tsconfig.json tells the TypeScript compiler what to compile and how strictly — and the right settings differ sharply between a Node service, a Vite app, an npm library, and a Next.js project. Copying a config from one context into another is a common source of confusing build errors: declarations that never emit, module resolution that cannot find imports, or a target too old for the runtime you actually ship to.

This starts from a preset matched to your target and exposes the options most likely to need changing — target, strict mode, declaration output, source maps, and modern bundler module resolution. It produces the compiler config; to decide which browsers your transpilation should support, check a Browserslist query, and to keep that TypeScript formatted consistently, generate a .prettierrc config.

Common use cases

  • New project setup — start from a preset instead of memorising compiler flags.
  • Library publishing — emit .d.ts declarations and source maps for consumers.
  • Strictness migration — turn on strict mode and see what it surfaces.
  • Framework alignment — match the module and target settings Next.js or Vite expect.
  • Teaching — show what each compiler option does from a working baseline.

Frequently asked questions

What does strict mode actually enable?

A bundle of checks — noImplicitAny, strictNullChecks, and others — that catch the majority of type bugs. Recommended for new code.

When should I set declaration: true?

When publishing a library, so consumers get type information. Apps that are not imported elsewhere do not need it.

What is moduleResolution: bundler?

A modern mode for Vite, esbuild, and webpack projects that resolves imports the way bundlers do, without requiring file extensions.

Does this compile my code?

No — it produces the config file. Run tsc or your bundler to actually compile.
Embed this tool on your site

Free to embed, no attribution required (but appreciated). Paste this where you want the tool to appear: