`yarn create next-app --ts` sets wrong eslint version

[PegasisForever]

What example does this report relate to?

yarn create next-app --typescript

What version of Next.js are you using?

11.1.2

What version of Node.js are you using?

16.10.0

What browser are you using?

chrome 94

What operating system are you using?

Arch Linux

How are you deploying your application?

N/A

Describe the Bug

When creating a next.js project using yarn create next-app --typescript, eslint version of the project is set to 8.0.0 in package.json, however eslint-config-next depends on eslint ^7.23.0.

When running yarn lint, it errors:

yarn run v1.22.15
$ next lint
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
error - ESLint must be installed: yarn add --dev eslint
Done in 0.86s.

When creating a next.js using npx create-next-app@latest --ts, the eslint version is set correctly.

I didn't test the non-ts version.

Expected Behavior

eslint version of the project should be ^7.23.0

To Reproduce

yarn create next-app --typescript
cd project_name
yarn lint

[DarkSuniuM]

Same just happened to me, ESLint version is 8.0.0 and I'm getting Error: Failed to patch ESLint because the calling module was not recognized.

As the author of this issue said, Downgrading ESLint to ^7.23.0 fixed my problem

[stefanprobst]

could be fixed by pinning the installed eslint version here i think

- const devDependencies = ['eslint', 'eslint-config-next']
+ const devDependencies = ['eslint@7', 'eslint-config-next']

[johngrant]

Same here. I created a new nextjs app using the boiler plate. Ran yarn lint. My package.json was initialized with version 8. When running subsequent lint or build commands I get the error error - ESLint must be installed: yarn add --dev eslint. Reverting to eslint version 7 removed the error during linting and building.

[karbica]

I am also encountering this issue. Downgrading the eslint version to 7.x.x from 8.0.0 fixed the issue.

[finn-orsini]

Adding some additional context here:

The cause of the ESLint must be installed failure is that eslint/lib/api.js is no longer an export of eslint v8. See v8 exports and the v8 migration guide. This causes the has-necessary-dependencies resolution to throw (Package subpath './lib/api.js' is not defined by "exports") and mark the dep as missing.

Updating the file value here to

- {file: 'eslint/lib/api.js',pkg: 'eslint'}, 
+ {file: 'eslint',pkg: 'eslint'}, 

would resolve this particular error.

However, the next eslint config has a rushstack dependency, so even when allowing for v8 above, you get the error mentioned in a few comments here:

Error: Cannot read config file: <repo_root>/node_modules/eslint-config-next/index.js
Error: Failed to patch ESLint because the calling module was not recognized.
If you are using a newer ESLint version that may be unsupported, please create a GitHub issue:
https://github.com/microsoft/rushstack/issues

See another report of this here: #29829.

Rushstack does not yet support eslint v8, but they have an issue here to do so: microsoft/rushstack#2890.

I'm happy to submit a PR to pin to ^7 as mentioned above in the meantime 👍

[housseindjirdeh]

Thanks for logging this folks, and apologies for any inconvenience this may be causing. @stefanprobst and @finn-orsini are both correct, and thank you @finn-orsini for submitting a PR to fix this so quickly!

Once #29837 is merged, the latest canary version will stick to installing v7 of ESLint and there's an open PR to add support for v8 (#29865). Once all sub-dependencies used in Next.js' ESLint config and plugin is supported, including rushstack, it'll be merged!

[tdkn]

I think if the next lint exits with an error, the exit code should be 1, not 0.
Otherwise, CI such as GitHub Action will pass the test.

❯ yarn lint
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
error - ESLint must be installed: yarn add --dev eslint

❯ echo $?
0

CI PASSED ESLint Step 😱