Format a tsconfig.json File

TypeScript projects live and die by their tsconfig.json. A misindented block, an unquoted key, or a stray trailing comma can silently break the TypeScript compiler's ability to resolve modules, causing confusing "cannot find module" errors that have nothing to do with whether the module actually exists. This example shows a standard Next.js tsconfig with strict mode enabled, modern module resolution, and path aliases configured. What makes tsconfig tricky is that TypeScript itself uses JSONC (JSON with Comments), which allows // and /* */ comments that standard JSON parsers reject. If you paste a tsconfig with comments into a JSON validator, it will fail even though TypeScript reads it just fine. The formatter here handles the pure JSON portions — strip comments first before validating strict JSON syntax. Key parts of this example: target: "ES2017" tells TypeScript which JavaScript features to downcompile to, ensuring compatibility with environments that don't support newer syntax. The lib array declares which built-in type definitions to include — dom gives you browser globals, esnext gives you modern JavaScript types. strict: true activates a bundle of safety checks that catch the most common bugs before runtime. The paths option with "@/*" maps the @ alias to the ./src/ directory, so imports like @/components/Button resolve correctly instead of requiring ../../components/Button relative paths. Real-world scenarios where this example helps: you've cloned a project and TypeScript throws path resolution errors even though all files exist — checking tsconfig paths against the vite or webpack alias configuration often reveals a mismatch. Or a team member has added an option that isn't valid in your TypeScript version, and you need to validate which options are available. Tips and pitfalls: moduleResolution: "bundler" is a newer option introduced in TypeScript 5 that works best with bundlers like Vite and esbuild. Older projects use "node" or "node16". Mixing them incorrectly causes import resolution failures. Also, exclude: ["node_modules"] is important — without it, TypeScript tries to type-check every file in node_modules, making compilation extremely slow. To customise this example, add or remove compilerOptions flags and paste your own tsconfig to check formatting and spot any syntax issues before committing.

{
  "compilerOptions": {
    "target": "ES2017",
    "lib": ["dom", "dom.iterable", "esnext"],
    "strict": true,
    "moduleResolution": "bundler",
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    },
    "jsx": "preserve",
    "incremental": true
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
  "exclude": ["node_modules"]
}