nextjs

> TypeScript configuration for Next.js apps (App Router and Pages Router). Extends @jmlweb/tsconfig-react with incremental builds, the Next.js plugin and an @/* alias.

✨ Features

🚀 Next.js Plugin: enhanced type checking for Next.js APIs
⚡ Incremental Builds: incremental: true for faster rebuilds
📁 Path Alias: @/* maps to the project root
⚛️ React Ready: inherits JSX, DOM types and bundler resolution
🔒 Strict Mode: inherits every strict flag from the base config

📦 Installation

npm install --save-dev @jmlweb/tsconfig-nextjs @jmlweb/tsconfig-react @jmlweb/tsconfig-base next typescript

🚀 Quick Start

{
  "extends": "@jmlweb/tsconfig-nextjs",
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules"]
}

💡 Examples

Pages Router

{
  "extends": "@jmlweb/tsconfig-nextjs",
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
  "exclude": ["node_modules"]
}

`src/` directory with custom aliases

Overriding paths replaces the default @/* entry.

{
  "extends": "@jmlweb/tsconfig-nextjs",
  "compilerOptions": {
    "paths": {
      "@/*": ["./src/*"],
      "@/components/*": ["./src/components/*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules"]
}

📋 Configuration Details

Extends @jmlweb/tsconfig-react (which extends @jmlweb/tsconfig-base) and adds:

Option	Value	Description
`incremental`	`true`	Reuse previous compilation info
`plugins`	`[{ "name": "next" }]`	Next.js TypeScript plugin
`paths`	`{ "@/": ["./"] }`	`@/*` alias pointing to project root

Inherited from the React config: jsx: "react-jsx", module: "ESNext", moduleResolution: "bundler", lib: ["ES2022", "DOM", "DOM.Iterable"].

incremental writes a .tsbuildinfo file; add it to .gitignore.

🎯 When to Use

✅ Next.js apps with the App Router or Pages Router
✅ Projects that want the @/* import convention

Plain React: use @jmlweb/tsconfig-react.

🔧 Extending the Configuration

{
  "extends": "@jmlweb/tsconfig-nextjs",
  "compilerOptions": {
    "noEmit": true,
    "paths": {
      "~/*": ["./src/*"]
    }
  }
}

📝 Usage with Scripts

{
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "typecheck": "tsc --noEmit"
  }
}

npm run typecheck

📋 Requirements

Node.js >= 22.12.0
TypeScript >= 5.0.0
Next.js >= 13.0.0

📦 Peer Dependencies

@jmlweb/tsconfig-react (^2.0.0), which itself requires @jmlweb/tsconfig-base (^2.0.0)
next (>=13.0.0)
typescript (>=5.0.0)

@jmlweb/tsconfig-react - config extended by this package
@jmlweb/tsconfig-base - root of the extends chain
@jmlweb/oxlint-config-react - Oxlint configuration for React (recommended)
@jmlweb/oxfmt-config-base - Oxfmt configuration (recommended)

🔄 Migration Guide

1.x → 2.0.0

Breaking: Node.js >=22.12.0 is now required (Node.js 18 and 20 are end-of-life).

Upgrade Node.js to 22.12.0 or later.
Update the package: npm install --save-dev @jmlweb/tsconfig-nextjs@^2.0.0.

The compilerOptions are unchanged. See the Changelog.

📄 License

MIT