eslint-config-next

16.2.4 verified Sat Apr 25 auth: no javascript

ESLint configuration package published by Vercel as part of Next.js, providing a curated set of rules for Next.js projects. Current stable version is 16.2.4, with canary releases in parallel. It integrates with the Next.js compiler, includes TypeScript and React-specific rules, and is updated frequently alongside Next.js releases. Enforces best practices for App Router, Pages Router, image optimization, and data fetching. Requires eslint >=9.0.0 and typescript >=3.3.1 as peer dependencies. Differentiators include automatic detection of Next.js configuration and seamless integration with Next.js toolchain.

Common errors

error Error: Failed to load config "next/core-web-vitals" to extend from. ↓

cause Using legacy eslintrc format; v16 only supports flat config.

fix

Switch to flat config: use import nextCoreWebVitals from 'eslint-config-next/core-web-vitals'.

error Error: ESLint configuration in eslintrc format is not supported. ↓

cause eslint-config-next v16 requires flat config.

fix

Create eslint.config.mjs or eslint.config.js with flat config.

error Cannot find module 'typescript' ↓

cause Missing peer dependency typescript.

fix

npm install typescript --save-dev

error Parsing error: Cannot read file 'tsconfig.json' ↓

cause TypeScript project not configured or tsconfig.json missing.

fix

Ensure tsconfig.json exists and is valid, or set project: null in config.

Warnings

breaking eslint-config-next v16 drops support for legacy eslintrc format. Flat config only. ↓

fix Migrate to flat config (eslint.config.js or mjs).

breaking Minimum eslint peer dependency increased to 9.0.0 in v16. ↓

fix Update eslint to >=9.0.0.

deprecated Import from 'eslint-config-next/parser' is deprecated; use 'next' config directly. ↓

fix Remove /parser import; import default config.

gotcha If using TypeScript, you must install typescript as a peer dependency even if not using TypeScript yourself. ↓

fix npm install typescript --save-dev

gotcha Rules may conflict with other ESLint plugins like eslint-plugin-react or eslint-plugin-import. Disable conflicting rules. ↓

fix Override specific rules in your config.

Install

npm install eslint-config-next

yarn add eslint-config-next

pnpm add eslint-config-next

Imports

default

wrong

const nextEslintConfig = require('eslint-config-next')

correct

import nextEslintConfig from 'eslint-config-next'

ESM-only since v16. Use import syntax with flat config.

next/core-web-vitals

wrong

const nextCoreWebVitals = require('eslint-config-next/core-web-vitals')

correct

import nextCoreWebVitals from 'eslint-config-next/core-web-vitals'

ESM-only; use import for flat config.

next/typescript
```
import nextTypescript from 'eslint-config-next/typescript'
```
ESM-only; standalone TypeScript config for flat config.

Quickstart

Shows how to use eslint-config-next with flat config in an eslint.config.mjs file, including core-web-vitals preset.

// eslint.config.mjs
import nextConfig from 'eslint-config-next';
import nextCoreWebVitals from 'eslint-config-next/core-web-vitals';

export default [
  nextConfig,
  nextCoreWebVitals,
  {
    rules: {
      // your custom rules
    }
  }
];