Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

next lint does not recognize eslint.config.js #64453

Closed
leetdavid opened this issue Apr 13, 2024 · 6 comments · Fixed by #71218
Closed

next lint does not recognize eslint.config.js #64453

leetdavid opened this issue Apr 13, 2024 · 6 comments · Fixed by #71218
Labels
bug Issue was opened via the bug report template. linear: next Confirmed issue that is tracked by the Next.js team. Linting Related to `next lint` or ESLint with Next.js. locked

Comments

@leetdavid
Copy link

leetdavid commented Apr 13, 2024

Link to the code that reproduces this issue

https://github.com/leetdavid/nextjstest

To Reproduce

  1. Run pnpm create next-app with ESLint Enabled
  2. Rename .eslintrc.json to eslint.config.js
  3. Run pnpm lint and it will create yet another .eslintrc.json after prompting.

Current vs. Expected behavior

I expect next lint to recognize the eslint.config.js file, but it does not.

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP Thu Jan 11 04:09:03 UTC 2024
  Available memory (MB): 31658
  Available CPU cores: 32
Binaries:
  Node: 21.7.1
  npm: 10.5.0
  Yarn: N/A
  pnpm: 8.15.6
Relevant Packages:
  next: 14.2.1 // Latest available version is detected (14.2.1).
  eslint-config-next: 14.2.1
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.4.5
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

ESLint (eslint-config-next)

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

I renamed the .eslintrc.json file to eslint.config.js and the above happens.

I am using turborepo.
Renaming my eslint file to .eslintrc.json file results in another error:

pnpm lint

╰─ pnpm lint     

> @monorepo-name/web@0.1.0 lint /<repo path>/apps/web
> next lint

Cannot read config file: /<repo path>/tools/eslint-config/base.js
Error: Unexpected token 'export'
Referenced from: /<repo path>/apps/web/.eslintrc.json

apps/web/.eslintrc.json (my next.js project path's .eslintrc.json, after renaming from eslint.config.js)

{
  "root": true,
  "extends": [
    "@monorepo-name/eslint-config/base",
    "@monorepo-name/eslint-config/nextjs",
    "@monorepo-name/eslint-config/react"
  ]
}

tools/eslint-config/base.js

/** @type {import("eslint").Linter.Config} */
const config = {
  extends: [
    "turbo",
    "prettier",
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended-type-checked",
    "plugin:@typescript-eslint/stylistic-type-checked",
    "plugin:import/recommended",
    "plugin:import/typescript",
  ],
  ...
}
export default config;

tools/eslint-config/nextjs.js

/** @type {import('eslint').Linter.Config} */
const config = {
  extends: ["plugin:@next/next/core-web-vitals"],
  rules: {
    "@next/next/no-html-link-for-pages": "off",
  },
};

export default config;

NEXT-3316

@leetdavid leetdavid added the bug Issue was opened via the bug report template. label Apr 13, 2024
@edvardsanta
Copy link

Next.js currently uses an ESLint version that predates v9.0.0, which does not recognize the eslint.config.js configuration file. This file format was introduced in ESLint v9.0.0. To support eslint.config.js, an update to ESLint v9.0.0 or newer is required. I think this change is a feature update rather than a bug fix, as it involves adopting a new major version of ESLint that includes enhancements and new configuration capabilities.

@leetdavid
Copy link
Author

Ok, that explains a lot. Thanks for the insight!

@samcx samcx added linear: next Confirmed issue that is tracked by the Next.js team. Linting Related to `next lint` or ESLint with Next.js. labels May 3, 2024
@ginnymin
Copy link

ginnymin commented Jun 4, 2024

Next.js currently uses an ESLint version that predates v9.0.0, which does not recognize the eslint.config.js configuration file. This file format was introduced in ESLint v9.0.0. To support eslint.config.js, an update to ESLint v9.0.0 or newer is required. I think this change is a feature update rather than a bug fix, as it involves adopting a new major version of ESLint that includes enhancements and new configuration capabilities.

Actually ESLint v8 introduced the flat config format; v9 made it the default config format (that you have to opt out of if you want to continue the legacy format). So the flat config should still work with ESLint V8.

@ryan-dahlia
Copy link

@edvardsanta Any update on this?

It appears ESLint v8.57.0 and beyond supports using the flat config files out of the box

Seems like the check that triggers the Next.js "How would you like to configure ESLint?" would need to be aware of eslint.config.js. WDYT?

@Byron2016
Copy link

Are there any notice about create-next-app will support ESlint V9 and eslint.config.js file?
Other related questions:
#64853
#64409
#64453

Copy link
Contributor

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Oct 29, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Issue was opened via the bug report template. linear: next Confirmed issue that is tracked by the Next.js team. Linting Related to `next lint` or ESLint with Next.js. locked
Projects
None yet
Development

Successfully merging a pull request may close this issue.

6 participants