Skip to main content
@zayne-labs/tsconfig provides battle-tested TypeScript configuration presets based on Total TypeScript’s TSConfig Cheat Sheet, with additional refinements for modern development.

Installation

pnpm add -D @zayne-labs/tsconfig

Base Configuration

All presets extend the base configuration, which includes strict type-checking and modern TypeScript features.
@zayne-labs/tsconfig/base
tsconfig
Core configuration with strict linting and isolated modules.Path: ./src/base/tsconfig.base.jsonIncludes:
{
  "compilerOptions": {
    // Module resolution
    "esModuleInterop": true,
    "moduleDetection": "force",
    "isolatedModules": true,
    "verbatimModuleSyntax": true,
    "resolveJsonModule": true,
    
    // Type checking
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noFallthroughCasesInSwitch": true,
    
    // Safety
    "skipLibCheck": true,
    "allowJs": false,
    "allowUnreachableCode": false,
    "forceConsistentCasingInFileNames": true,
    
    // Modern features
    "useDefineForClassFields": true,
    "erasableSyntaxOnly": true,
    "allowSyntheticDefaultImports": true,
    "noErrorTruncation": true
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/base"
}

Choosing the Right Preset

Decide based on two key questions:
  1. Are you using tsc to transpile .ts files to .js?
    • Yes → Use tsc/* presets
    • No (using bundler like Vite, Webpack) → Use bundler/* presets
  2. Does your code run in the DOM?
    • Yes (browser apps) → Use */dom/* presets
    • No (Node.js, CLIs) → Use */no-dom/* presets

TSC Presets

For projects using TypeScript’s tsc compiler directly.

DOM Environments

@zayne-labs/tsconfig/tsc/dom/app
tsconfig
For applications running in the browser, transpiled with tsc.Path: ./src/tsc/dom/tsconfig.app.jsonConfiguration:
{
  "compilerOptions": {
    "module": "NodeNext",
    "target": "ES2022",
    "lib": ["ES2022", "DOM", "DOM.Iterable"],
    "sourceMap": true,
    "outDir": "dist"
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/tsc/dom/app"
}
@zayne-labs/tsconfig/tsc/dom/library
tsconfig
For libraries running in the browser, with declaration files.Path: ./src/tsc/dom/tsconfig.library.jsonConfiguration:
{
  "compilerOptions": {
    "module": "NodeNext",
    "target": "ES2022",
    "lib": ["ES2022", "DOM", "DOM.Iterable"],
    "sourceMap": true,
    "outDir": "dist",
    "declaration": true
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/tsc/dom/library"
}
@zayne-labs/tsconfig/tsc/dom/library-monorepo
tsconfig
For libraries in monorepos with TypeScript project references.Path: ./src/tsc/dom/tsconfig.library-monorepo.jsonConfiguration:
{
  "compilerOptions": {
    "module": "NodeNext",
    "target": "ES2022",
    "lib": ["ES2022", "DOM", "DOM.Iterable"],
    "sourceMap": true,
    "outDir": "dist",
    "declaration": true,
    "composite": true,
    "declarationMap": true
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/tsc/dom/library-monorepo"
}

Non-DOM Environments

@zayne-labs/tsconfig/tsc/no-dom/app
tsconfig
For Node.js applications or CLIs.Path: ./src/tsc/no-dom/tsconfig.app.jsonConfiguration:
{
  "compilerOptions": {
    "module": "NodeNext",
    "target": "ES2022",
    "lib": ["ES2022"],
    "sourceMap": true,
    "outDir": "dist"
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/tsc/no-dom/app"
}
@zayne-labs/tsconfig/tsc/no-dom/library
tsconfig
For Node.js libraries with declaration files.Path: ./src/tsc/no-dom/tsconfig.library.jsonConfiguration:
{
  "compilerOptions": {
    "module": "NodeNext",
    "target": "ES2022",
    "lib": ["ES2022"],
    "sourceMap": true,
    "outDir": "dist",
    "declaration": true
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/tsc/no-dom/library"
}
@zayne-labs/tsconfig/tsc/no-dom/library-monorepo
tsconfig
For Node.js libraries in monorepos.Path: ./src/tsc/no-dom/tsconfig.library-monorepo.jsonConfiguration: Same as tsc/dom/library-monorepo but with lib: ["ES2022"]Usage:
{
  "extends": "@zayne-labs/tsconfig/tsc/no-dom/library-monorepo"
}

Bundler Presets

For projects using external bundlers (Vite, Webpack, esbuild, etc.) that handle transpilation.

DOM Environments

@zayne-labs/tsconfig/bundler/dom
tsconfig
For browser apps/libraries using a bundler. Aliases: bundler/dom/app, bundler/dom/library, bundler/dom/library-monorepo.Path: ./src/bundler/tsconfig.dom.jsonConfiguration:
{
  "compilerOptions": {
    "module": "Preserve",
    "target": "ESNext",
    "lib": ["ESNext", "DOM", "DOM.Iterable"],
    "noEmit": true,
    "jsx": "preserve"
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/bundler/dom"
}
All bundler/dom/* paths point to the same config since bundlers handle both apps and libraries identically.
@zayne-labs/tsconfig/bundler/next
tsconfig
Specialized preset for Next.js applications.Path: ./src/bundler/tsconfig.next.jsonConfiguration:
{
  "compilerOptions": {
    "module": "Preserve",
    "target": "ESNext",
    "lib": ["ESNext", "DOM", "DOM.Iterable"],
    "noEmit": true,
    "jsx": "preserve",
    "plugins": [{ "name": "next" }],
    "incremental": true
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/bundler/next",
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules"]
}

Non-DOM Environments

@zayne-labs/tsconfig/bundler/no-dom
tsconfig
For Node.js apps/libraries using a bundler. Aliases: bundler/no-dom/app, bundler/no-dom/library, bundler/no-dom/library-monorepo.Path: ./src/bundler/tsconfig.no-dom.jsonConfiguration:
{
  "compilerOptions": {
    "module": "Preserve",
    "target": "ESNext",
    "lib": ["ESNext"],
    "noEmit": true,
    "jsx": "preserve"
  }
}
Usage:
{
  "extends": "@zayne-labs/tsconfig/bundler/no-dom"
}

Quick Reference

Use CaseEnvironmentPreset
React app with ViteBrowser + Bundlerbundler/dom
Next.js appBrowser + Bundlerbundler/next
Node.js CLINode + Bundlerbundler/no-dom
React library (tsc)Browser + tsctsc/dom/library
Monorepo packageBrowser + tsctsc/dom/library-monorepo
Express APINode + tsctsc/no-dom/app

Extending Presets

All presets can be extended with project-specific options:
{
  "extends": "@zayne-labs/tsconfig/bundler/dom",
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "include": ["src"],
  "exclude": ["node_modules", "dist"]
}

Key Differences

TSC vs Bundler

  • TSC presets: Use module: "NodeNext" and target: "ES2022" for direct compilation
  • Bundler presets: Use module: "Preserve" and target: "ESNext", letting the bundler handle transpilation

App vs Library

  • App presets: No declaration files needed
  • Library presets: Include declaration: true for distributing types

Library vs Library-Monorepo

  • Library-Monorepo: Adds composite: true and declarationMap: true for TypeScript project references
These presets prioritize type safety with strict checking and modern TypeScript features. Adjust individual compiler options as needed for your project.

Build docs developers (and LLMs) love