Try this

import pluginNext from '@next/eslint-plugin-next'

export default defineConfig([
  {
    plugins: {
      '@next/next': pluginNext
    },
  },
  {
    files: ['**/*.ts', '**/*.tsx'],
    rules: {
      ...pluginNext.configs.recommended.rules
    }
  }
])
Answer from TheFabi8A on Stack Overflow
🌐
GitHub
github.com › vercel › next.js › discussions › 49337
How to use new "flat config" approach in Eslint? · vercel/next.js · Discussion #49337
Switching my projects to flat config was taking more time than it was worth. Beta Was this translation helpful? Give feedback. ... There was an error while loading. Please reload this page. Something went wrong. There was an error while loading. Please reload this page. ... There was an error while loading. Please reload this page. ... Something went wrong. There was an error while loading. Please reload this page. ... I have created a package eslint-config-next-flat (Source code) that is (roughly) a port of the eslint-config-next for FlatConfig.
Author   vercel
🌐
Next.js
nextjs.org › docs › app › api-reference › config › eslint
Configuration: ESLint | Next.js
2 weeks ago - eslint-config-next/typescript: Adds TypeScript-specific linting rules from typescript-eslint. Use this alongside the base or core-web-vitals config. Get linting working quickly with the ESLint CLI (flat config):
🌐
DEV Community
dev.to › jordanahaines › just-use-this-nextjs-eslint-configuration-540
Just use this Next.js Eslint Configuration - DEV Community
January 12, 2025 - Because I couldn't easily extend this deprecated configuration, I (swore and then) scrapped it and initialized a new eslint config with npm init @eslint/config@latest. I then added the configuration for next wrapped with eslint's flat compat utility.
🌐
GitHub
github.com › vercel › next.js › issues › 64114
New ESLint "flat" configuration file does not work with `next/core-web-vitals` · Issue #64114 · vercel/next.js
April 5, 2024 - For extra context, ESLint is moving from .eslintrc.json to eslint.config.js, and all other shareable ESLint configs I am using (e.g., typescript-eslint, eslint-config-prettier) already support this, even without needing to use FlatCompat.
Published   Apr 05, 2024
🌐
GitHub
github.com › vercel › next.js › discussions › 50453
How can I use the new ESLint flat config in a Next.js project and also use 'canonical' rules? · vercel/next.js · Discussion #50453
After updating eslint config to flat format, eslint needs it to be in an eslint.config.js file for eslint to be happy with the flat format.
Author   vercel
🌐
Stack Overflow
stackoverflow.com › questions › 76352104 › how-can-i-use-the-new-eslint-flat-config-in-a-next-js-project-and-also-use-cano
typescript - How can I use the new ESLint flat config in a Next.js project and also use 'canonical' rules? - Stack Overflow
Below is my src/eslint.config.ts which I transpile to eslint.config.js. import path from 'path'; import { fileURLToPath } from 'url'; import { FlatCompat } from '@eslint/eslintrc'; import typeScriptEslintPlugin from '@typescript-eslint/eslint-plugin'; import tsParser from '@typescript-eslint/parser'; import { type Linter } from 'eslint'; import functional from 'eslint-plugin-functional'; import globals from 'globals'; // import eslintPluginImport from 'eslint-plugin-import'; // Seems unnecessary.
🌐
Medium
blog.linotte.dev › eslint-9-next-js-935c2b6d0371
Next.js & ESLint 9 Setup Guide | Linotte Blog
October 14, 2024 - In April of 2024, ESLint released v9.0.0, a new major version. Flat config is now the default configuration, which is a big structural change for ESLint users, plugin developers, and integrators.
🌐
Medium
medium.com › @oliviarizona › eslint-flat-config-e94d4bd11525
ESlint flat config
December 19, 2024 - Flat Config is the new configuration system introduced by ESLint to replace the .eslintrc format. ESLint’s goal was to make configurations more consistent, performant, and aligned with JavaScript's evolving landscape.
Find elsewhere
🌐
Chris
chris.lu › web_development › tutorials › next-js-static-first-mdx-starterkit › linting-setup-using-eslint
Linting setup using ESLint 9 flat config - Next.js 15 Tutorial
In ESLint v9 the eslintrc files are deprecated, support for eslintrc (classic) configuration files will be removed in ESLint version 10.0.0 ... if Next.js detects that you are still using ESLint v8 they automatically set the ESLINT_USE_FLAT_CONFIG=false flag, which enables support for flat ...
🌐
Chris
chris.lu › web_development › tutorials › next-js-static-first-mdx-starterkit › typescript-eslint-flat-config
Typescript Linting and custom flat config - Next.js 15 Tutorial
Line 72: we can now remove next/typescript from the compatibility mode (compat.extends), as it gets replaced by our custom typescript-eslint config · Line 76: we set the FlatConfig type from the @typescript-eslint utilities as type for our default export (to replace the type from the ESLint package which is what we were using previously), the reason to switch for the Config type from ESLint to the one from @typescript-eslint utilities is because of issues related with the type of the default export, you can read more about those issues in the next chapter
🌐
Reddit
reddit.com › r/nextjs › eslint flat config + prettier
Eslint flat config + prettier : r/nextjs
February 6, 2023 - { "extends":["standard", "next/core-web-vitals", "prettier"], "parser": "@typescript-eslint/parser", "plugins": ["@typescript-eslint", "prettier", "simple-import-sort"], "rules": { "prettier/prettier": "error", "react/react-in-jsx-scope": "off", "simple-import-sort/imports": "error", "simple-import-sort/exports": "error", "no-unused-vars": "off", "@typescript-eslint/no-unused-vars": "error" }, "overrides": [ // override "simple-import-sort" config { "files": ["*.js", "*.jsx", "*.ts", "*.tsx"], "rules": { "simple-import-sort/imports": [ "error", { "groups": [ // Packages `react` related packages come first.
🌐
Medium
allalmohamedlamine.medium.com › eslint-flat-config-and-new-system-an-ultimate-deep-dive-2023-46aa151cbf2b
Eslint flat config and new system an ultimate deep dive 2023 | by Mohamed Lamine Allal | Medium
November 27, 2023 - can be inspired by tools like ◌ nextjs ◌ tauri ◌ … ◌ reuse their CLI code - and do it fast · Personally, at least for now. I’m sticking with the combination of snippets, boiler and modules. And generally i always use snippets as it works faster for me, with no friction. I’m counting on doing better though. ▪️ Flat config: Setting up Eslint and Prettier with eslint-prettier-plugin 🔥🔥 👀
🌐
npm
npmjs.com › package › eslint-config-next
eslint-config-next - npm
ESLint configuration used by Next.js.. Latest version: 16.1.6, last published: a month ago. Start using eslint-config-next in your project by running `npm i eslint-config-next`. There are 1677 other projects in the npm registry using eslint-config-next.
      » npm install eslint-config-next
    
Published   Jan 27, 2026
Version   16.1.6
🌐
GitHub
github.com › jeremy-code › eslint-config-next-flat
GitHub - jeremy-code/eslint-config-next-flat: Intended as a stop-gap solution until Next.js updates their config to support Flat Config.
const js = require("@eslint/js"); const next = require("eslint-config-next-flat"); const parser = require("next/dist/compiled/babel/eslint-parser"); /** @type {import('eslint').Linter.FlatConfig}[] */ module.exports = [ { ignore: [".next"] }, // Change if `distDir` in Next.js config is different js.configs.recommended, next, { files: ["**/*.js", "**/*.jsx"], languageOptions: { parser, parserOptions: { requireConfigFile: false, sourceType: "module", allowImportExportEverywhere: true, babelOptions: { presets: ["next/babel"], caller: { supportsTopLevelAwait: true, }, }, }, }, }, ];
Author   jeremy-code
🌐
Medium
medium.com › @mdnoushadsiddiqi › fixing-next-js-eslint-errors-with-flat-config-in-eslint-9-f622d4570af0
Fixing Next.js ESLint Errors with Flat Config in ESLint 9 | by Mohammad Noushad Siddiqi | Medium
October 2, 2025 - Old .eslintrc configs with plugins: ["@next/next"] are no longer valid. Next.js still bundles legacy configs. That’s why you see “plugin not detected” warnings unless you switch to flatConfig. Don’t redefine the Next.js plugin. If you extend nextPlugin.flatConfig.coreWebVitals, it already includes the plugin. Nextjs ·
🌐
Medium
medium.com › @paulnodet › embracing-eslints-flat-config-system-our-migration-4d4caccdb4f2
Embracing ESLint’s Flat Config System: Our Migration | by Paul Nodet | Medium
November 17, 2023 - React Native and Babel: React Native projects faced issues due to the new ESM requirement. We’re actively seeking solutions to integrate the flat config system within these constraints. Next.js Compatibility: The standard next lint command did not play well with eslint.config.js.
🌐
Chris
chris.lu › web_development › tutorials › next-js-16-linting-setup-eslint-9-flat-config
Next.js 16 Linting setup using ESLint 9 flat config | chris.lu
Setting up proper linting in your Next.js 16 project is crucial for maintaining code quality and consistency. This comprehensive guide walks you through configuring ESLint 9 with the modern flat config format, including support for TypeScript, React, MDX, and various ESLint plugins.
🌐
freeCodeCamp
freecodecamp.org › news › how-to-set-up-eslint-prettier-stylelint-and-lint-staged-in-nextjs
How to Set Up ESLint, Prettier, StyleLint, and lint-staged in Next.js
May 30, 2025 - Also, ESLint has a new configuration file format often called flat config (which I haven't used here) where the config files are either JavaScript or TypeScript files.
🌐
ESLint
eslint.org › docs › latest › use › configure › migration-guide
Configuration Migration Guide - ESLint - Pluggable JavaScript Linter
If you are using .eslintrc.js, the migration results in a config file that matches the evaluated output of your configuration and won’t include any functions, conditionals, or anything other than the raw data represented in your configuration. The flat config file format has been the default configuration file format since ESLint v9.0.0.