Typescript project using eslint.config.mjs
. After upgrading to NextJS, started to see this warning message:
The Next.js plugin was not detected in your ESLint configuration. See https://nextjs.org/docs/app/building-your-application/configuring/eslint#migrating-existing-config
Changed eslint.config.mjs
to include the rules and the plugin. Following this post's suggestion: Proper eslint configuration under NextJS 15
import eslint from "@eslint/js";
import tseslint from "typescript-eslint";
import eslintPluginNext from "@next/eslint-plugin-next";
export default tseslint.config({
files: ["src/**/*.ts", "src/**/*.tsx"],
ignores: ["src/__generated__/**/*"],
plugins: {
'@next/next': eslintPluginNext, // adding plugin
},
extends: [
eslint.configs.recommended,
...tseslint.configs.strictTypeChecked,
...tseslint.configs.stylisticTypeChecked,
],
languageOptions: {
parserOptions: {
projectService: true,
tsconfigRootDir: import.meta.dirname,
},
},
rules: {
...eslintPluginNext.configs.recommended.rules, // importing the rules
"@typescript-eslint/no-unused-vars": [
"error",
{
args: "all",
argsIgnorePattern: "^_",
caughtErrors: "all",
caughtErrorsIgnorePattern: "^_",
destructuredArrayIgnorePattern: "^_",
varsIgnorePattern: "^_",
ignoreRestSiblings: true
}
],
"@typescript-eslint/restrict-template-expressions": [
"error",
{
allowNumber: true,
allowBoolean: true,
}
],
}
});
There is no other lint config files e.g. .eslintrc.json etc.
dev deps:
"@biomejs/biome": "^1.9.4",
"@graphql-codegen/cli": "^5.0.3",
"@graphql-codegen/fragment-matcher": "^5.0.2",
"@graphql-codegen/typescript-operations": "^4.3.1",
"@graphql-codegen/typescript-react-apollo": "^4.3.2",
"@swc/core": "^1.9.2",
"@swc/helpers": "^0.5.15",
"@types/node": "^22.9.0",
"@types/react": "^18.3.12",
"@types/react-dom": "^18.3.1",
"dotenv": "^16.4.5",
"eslint": "^9.15.0",
"eslint-config-next": "^15.0.3",
"graphql": "^16.9.0",
"jest": "^29.7.0",
"postcss": "^8.4.49",
"shadcn": "^2.1.6",
"tailwindcss": "^3.4.15",
"ts-node": "^10.9.2",
"tsconfig-paths": "^4.2.0",
"typescript": "^5.6.3",
"typescript-eslint": "^8.14.0"
Is this a false positive ? This warning was not previously there in Next 14
It helps to put the next-eslint stuff into a separate object:
export default tseslint.config(
{...},
{
plugins: {
'@next/next': eslintPluginNext
},
{
rules: ...eslintPluginNext.configs.recommended.rules
}
}
)
The linter treats separate objects differently in a somewhat obscure - but intended - manner (or some plugins themselves behave diffently depending on whether they're "alone" or not). If this alone doesn't do the trick, you can additionally try to move this logic at the buttom of the list/make it the last of the varargs, so it will take precendence over other values with the same names.