{
  "extends": "./tsconfig.base.json",
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "strict": true,
    "outDir": "./dist",
    "rootDir": "./src",
    "declaration": true,
    "declarationMap": true,
    "sourceMap": true,
    "paths": {
      "@utils/*": ["./src/utils/*"]
    }
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist", "**/*.spec.ts"]
}

{
  "compilerOptions": {
    "strict": true
  }
}

// strictNullChecks: false (dangerous default in older configs)
let name: string = null;   // allowed — no error
let len = name.length;     // crashes at runtime

// strictNullChecks: true (correct)
let name: string = null;   // Error: Type 'null' is not assignable to type 'string'

// You must widen the type to allow null
let name: string | null = null;  // fine

// And narrow it before use
if (name !== null) {
  console.log(name.length);  // safe — TypeScript knows name is string here
}

// Common pattern: optional function parameter
function greet(user?: { name: string }) {
  // user is 'User | undefined' — must check before use
  if (!user) {
    console.log('Hello, stranger!');
    return;
  }
  console.log(`Hello, ${user.name}!`);
}

// Nullish coalescing with strict null checks
function getDisplayName(name: string | null | undefined): string {
  return name ?? 'Anonymous';
}

type Handler = (event: MouseEvent) => void;

// Without strictFunctionTypes this assignment is allowed — but it's wrong:
// UIEvent is a supertype of MouseEvent, it lacks MouseEvent-specific properties
const handler: Handler = (e: UIEvent) => {
  console.log(e.clientX);  // UIEvent has no clientX — runtime crash
};

// With strictFunctionTypes: true
// Error: Type '(e: UIEvent) => void' is not assignable to type 'Handler'
//   Types of parameters 'e' and 'event' are incompatible.

// noImplicitAny: false (permissive)
function add(a, b) {  // a and b are implicitly any
  return a + b;       // no error, no type safety
}
add('hello', 42);     // no error — silently returns 'hello42'

// noImplicitAny: true
function add(a, b) {  // Error: Parameter 'a' implicitly has an 'any' type
  return a + b;
}

// Fix: annotate your parameters
function add(a: number, b: number): number {
  return a + b;
}
add('hello', 42);  // Error: Argument of type 'string' is not assignable to 'number'

// Also catches untyped destructuring and complex inference failures
const config = JSON.parse(rawJson);  // config is 'any' — this is intentional
                                     // noImplicitAny does NOT flag explicit any

// But this is flagged:
function process({ data }) {  // Error: 'data' has implicit any type
  return data;
}

// Fix:
function process({ data }: { data: unknown }) {
  return data;
}

{
  "compilerOptions": {
    "target": "ES2020"
  }
}

// For Node.js (CommonJS)
{ "compilerOptions": { "module": "CommonJS" } }

// For bundlers (Vite, webpack, Rollup)
{ "compilerOptions": { "module": "ESNext" } }

// For Node.js 16+ with ESM
{ "compilerOptions": { "module": "Node16" } }

// For Node.js 22+ with ESM
{ "compilerOptions": { "module": "NodeNext" } }

// Source TypeScript
import { readFile } from 'fs/promises';
export function loadConfig(path: string) {
  return readFile(path, 'utf-8');
}

// Emitted with module: "CommonJS"
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.loadConfig = loadConfig;
const promises_1 = require("fs/promises");
function loadConfig(path) {
  return (0, promises_1.readFile)(path, 'utf-8');
}

// Emitted with module: "ESNext"
import { readFile } from 'fs/promises';
export function loadConfig(path) {
  return readFile(path, 'utf-8');
}

// For a Vite/Next.js frontend
{
  "compilerOptions": {
    "module": "ESNext",
    "moduleResolution": "bundler"
  }
}

// For a Node.js 18+ backend with ESM
{
  "compilerOptions": {
    "module": "Node16",
    "moduleResolution": "node16"
  }
}

// Browser app — include DOM + modern ECMAScript APIs
{
  "compilerOptions": {
    "lib": ["DOM", "DOM.Iterable", "ES2022"]
  }
}

// Node.js backend — no DOM, only ECMAScript
{
  "compilerOptions": {
    "lib": ["ES2022"]
  }
}

// Service worker / web worker
{
  "compilerOptions": {
    "lib": ["WebWorker", "ES2020"]
  }
}

// Without "DOM" in lib:
document.getElementById('app');  // Error: Cannot find name 'document'
fetch('/api/data');               // Error: Cannot find name 'fetch'

// Without "ES2022" in lib:
const arr = [1, 2, 3];
arr.at(-1);    // Error: Property 'at' does not exist on type 'number[]'

// With correct lib settings — all of these type-check fine

{
  "compilerOptions": {
    "rootDir": "./src",   // TypeScript source lives here
    "outDir": "./dist"    // Compiled JavaScript goes here
  }
}

# With rootDir: "./src" and outDir: "./dist"
# Source structure:
src/
  index.ts
  utils/
    helpers.ts
  models/
    user.ts

# Compiled output mirrors the source structure:
dist/
  index.js
  utils/
    helpers.js
  models/
    user.js

{
  "compilerOptions": {
    "declaration": true,
    "declarationMap": true,
    "sourceMap": true
  }
}

// src/math.ts
export function add(a: number, b: number): number {
  return a + b;
}

export interface Vector2D {
  x: number;
  y: number;
}

// dist/math.d.ts (generated with declaration: true)
export declare function add(a: number, b: number): number;
export interface Vector2D {
  x: number;
  y: number;
}

{
  "compilerOptions": {
    "sourceMap": true,       // generates .js.map files alongside .js
    "inlineSourceMap": false // alternative: embed map directly in .js (not for prod)
  }
}

# With sourceMap: true:
dist/
  index.js        # compiled JavaScript
  index.js.map    # source map (references original .ts file)

# Stack trace without source map:
TypeError: Cannot read property 'name' of undefined
  at dist/index.js:42:18

# Stack trace with source map (Node.js uses --enable-source-maps flag):
TypeError: Cannot read property 'name' of undefined
  at processUser (src/index.ts:15:22)

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@utils/*": ["./src/utils/*"],
      "@components/*": ["./src/components/*"],
      "@models/*": ["./src/models/*"],
      "@config": ["./src/config/index.ts"]
    }
  }
}

// Without paths aliases — unreadable:
import { Logger } from '../../../utils/logger';
import { UserModel } from '../../models/user';
import { AppConfig } from '../../../../config';

// With paths aliases — clean and refactor-friendly:
import { Logger } from '@utils/logger';
import { UserModel } from '@models/user';
import { AppConfig } from '@config';

{
  "include": [
    "src/**/*",
    "tests/**/*"
  ],
  "exclude": [
    "node_modules",
    "dist",
    "**/*.spec.ts",
    "**/*.test.ts",
    "coverage"
  ]
}

// tsconfig.base.json — shared across all packages
{
  "compilerOptions": {
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    "declaration": true,
    "declarationMap": true,
    "sourceMap": true
  }
}

// packages/web/tsconfig.json — extends base, adds browser-specific settings
{
  "extends": "../../tsconfig.base.json",
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "lib": ["DOM", "DOM.Iterable", "ES2020"],
    "jsx": "react-jsx",
    "outDir": "./dist",
    "rootDir": "./src"
  },
  "include": ["src/**/*"]
}

// packages/api/tsconfig.json — extends base, adds Node.js-specific settings
{
  "extends": "../../tsconfig.base.json",
  "compilerOptions": {
    "target": "ES2022",
    "module": "CommonJS",
    "moduleResolution": "node",
    "lib": ["ES2022"],
    "outDir": "./dist",
    "rootDir": "./src"
  },
  "include": ["src/**/*"]
}

// tsconfig.json for a React + Vite project
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "lib": ["ES2020", "DOM", "DOM.Iterable"],

    // JSX
    "jsx": "react-jsx",

    // Strict type checking
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true,

    // Interop
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "resolveJsonModule": true,

    // Path aliases
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    },

    // Build output
    "outDir": "./dist",
    "rootDir": "./src",

    // Source maps for debugging
    "sourceMap": true,

    // Skip type-checking .d.ts files from packages
    "skipLibCheck": true
  },
  "include": ["src"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

// tsconfig.json for an Express/Fastify Node.js API
{
  "compilerOptions": {
    "target": "ES2022",
    "module": "CommonJS",
    "moduleResolution": "node",
    "lib": ["ES2022"],

    // Strict type checking
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,

    // Interop
    "esModuleInterop": true,
    "resolveJsonModule": true,

    // Decorators (for NestJS/TypeORM)
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,

    // Build output
    "outDir": "./dist",
    "rootDir": "./src",

    // Source maps for production debugging
    "sourceMap": true,

    // Incremental compilation — speeds up tsc
    "incremental": true,
    "tsBuildInfoFile": ".tsbuildinfo",

    "skipLibCheck": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist", "**/*.spec.ts"]
}

// tsconfig.json for a published npm library
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "lib": ["ES2020"],

    // Strict type checking
    "strict": true,
    "exactOptionalPropertyTypes": true,
    "noUncheckedIndexedAccess": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,

    // Library output — consumers need types
    "declaration": true,
    "declarationMap": true,
    "sourceMap": true,
    "outDir": "./dist",
    "rootDir": "./src",

    // Required for project references / composite builds
    "composite": true,

    "skipLibCheck": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist", "**/*.test.ts", "**/*.spec.ts"]
}

// noUnusedLocals: true
function processData(input: string) {
  const trimmed = input.trim();  // used below
  const uppercased = input.toUpperCase();  // Error: 'uppercased' is declared but its value is never read

  return trimmed;
}

// noUnusedParameters: true
function greet(name: string, title: string) {  // Error: 'title' is declared but its value is never read
  return `Hello, ${name}!`;
}

// Fix: prefix with _ to intentionally mark a parameter as unused
function greet(name: string, _title: string) {  // no error
  return `Hello, ${name}!`;
}

// exactOptionalPropertyTypes: false (default)
interface Config {
  timeout?: number;  // means: timeout is missing OR timeout is undefined
}
const c: Config = { timeout: undefined };  // allowed

// exactOptionalPropertyTypes: true
interface Config {
  timeout?: number;  // means ONLY: timeout is missing (not present in the object)
}
const c: Config = { timeout: undefined };  // Error: Type 'undefined' is not assignable to type 'number'

// To allow undefined explicitly, you must say so:
interface Config {
  timeout?: number | undefined;
}

{
  "compilerOptions": {
    "incremental": true,
    "tsBuildInfoFile": ".tsbuildinfo"
  }
}

# First build — checks everything
$ tsc
# 8.2s

# Second build — only changed files
$ tsc
# 0.4s

# The .tsbuildinfo file is a JSON cache — add it to .gitignore
echo ".tsbuildinfo" >> .gitignore

// Modern React project (React 17+)
{
  "compilerOptions": {
    "jsx": "react-jsx"
  }
}
// With react-jsx you do NOT need to import React in every file:
// import React from 'react';  // no longer needed