Support ESLint v8 (#29865)

Co-authored-by: Michaël De Boey <info@michaeldeboey.be>
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>

packages/create-next-app/create-app.ts

@@ -229,7 +229,7 @@ export async function createApp({
     /**
      * Default devDependencies.
      */
-    const devDependencies = ['eslint@7', 'eslint-config-next']
+    const devDependencies = ['eslint', 'eslint-config-next']
     /**
      * TypeScript projects will have type definitions and other devDependencies.
      */

packages/eslint-config-next/package.json

@@ -10,17 +10,17 @@
   },
   "dependencies": {
     "@next/eslint-plugin-next": "12.0.4",
-    "@rushstack/eslint-patch": "^1.0.6",
-    "@typescript-eslint/parser": "^4.20.0",
+    "@rushstack/eslint-patch": "^1.0.8",
+    "@typescript-eslint/parser": "^5.0.0",
     "eslint-import-resolver-node": "^0.3.4",
     "eslint-import-resolver-typescript": "^2.4.0",
-    "eslint-plugin-import": "^2.22.1",
-    "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-react": "^7.23.1",
-    "eslint-plugin-react-hooks": "^4.2.0"
+    "eslint-plugin-import": "^2.25.2",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-react": "^7.27.0",
+    "eslint-plugin-react-hooks": "^4.3.0"
   },
   "peerDependencies": {
-    "eslint": "^7.23.0",
+    "eslint": "^7.23.0 || ^8.0.0",
     "next": ">=10.2.0",
     "typescript": ">=3.3.1"
   },

packages/next/lib/eslint/runLintCheck.ts

@@ -94,8 +94,8 @@ async function lint(
           lintDuringBuild ? ' in order to run during builds:' : ':'
         } ${chalk.bold.cyan(
           (await isYarn(baseDir))
-            ? 'yarn add --dev eslint@"<8.0.0"' // TODO: Remove @"<8.0.0" when ESLint v8 is supported https://github.com/vercel/next.js/pull/29865
-            : 'npm install --save-dev eslint@"<8.0.0"' // TODO: Remove @"<8.0.0" when ESLint v8 is supported https://github.com/vercel/next.js/pull/29865
+            ? 'yarn add --dev eslint'
+            : 'npm install --save-dev eslint'
         )}`
       )
       return null
@@ -111,16 +111,7 @@ async function lint(
         'error'
       )} - Your project has an older version of ESLint installed${
         eslintVersion ? ' (' + eslintVersion + ')' : ''
-      }. Please upgrade to ESLint version 7`
-    } else if (semver.gte(eslintVersion, '8.0.0')) {
-      // TODO: Remove this check when ESLint v8 is supported https://github.com/vercel/next.js/pull/29865
-      return `${chalk.red('error')} - ESLint version ${
-        eslintVersion ? eslintVersion : '8'
-      } is not yet supported. Please downgrade to version 7 for the meantime: ${chalk.bold.cyan(
-        (await isYarn(baseDir))
-          ? 'yarn remove eslint && yarn add --dev eslint@"<8.0.0"'
-          : 'npm uninstall eslint && npm install --save-dev eslint@"<8.0.0"'
-      )}`
+      }. Please upgrade to ESLint version 7 or above`
     }
 
     let options: any = {

test/integration/eslint/test/index.test.js

@@ -25,10 +25,6 @@ const dirInvalidOlderEslintVersion = join(
   __dirname,
   '../invalid-eslint-version'
 )
-const dirInvalidNewerEslintVersion = join(
-  __dirname,
-  '../invalid-newer-eslint-version'
-)
 const dirMaxWarnings = join(__dirname, '../max-warnings')
 const dirEmptyDirectory = join(__dirname, '../empty-directory')
 const dirEslintIgnore = join(__dirname, '../eslint-ignore')
@@ -115,24 +111,6 @@ describe('ESLint', () => {
       )
     })
 
-    // TODO: Remove this test when ESLint v8 is supported https://github.com/vercel/next.js/pull/29865
-    test('invalid newer eslint version', async () => {
-      const { stdout, stderr } = await nextBuild(
-        dirInvalidNewerEslintVersion,
-        [],
-        {
-          stdout: true,
-          stderr: true,
-        }
-      )
-
-      const output = stdout + stderr
-      console.log(output)
-      expect(output).toContain(
-        'ESLint version 8.0.1 is not yet supported. Please downgrade to version 7 for the meantime'
-      )
-    })
-
     test('empty directories do not fail the build', async () => {
       const { stdout, stderr } = await nextBuild(dirEmptyDirectory, [], {
         stdout: true,

test/integration/telemetry/test/index.test.js

@@ -519,7 +519,10 @@ describe('Telemetry CLI', () => {
   })
 
   it('emits telemetry for lint during build', async () => {
-    await fs.writeFile(path.join(appDir, '.eslintrc'), `{ "extends": "next" }`)
+    await fs.writeFile(
+      path.join(appDir, '.eslintrc'),
+      `{ "root": true, "extends": "next" }`
+    )
     const { stderr } = await nextBuild(appDir, [], {
       stderr: true,
       env: { NEXT_TELEMETRY_DEBUG: 1 },
@@ -541,7 +544,10 @@ describe('Telemetry CLI', () => {
   })
 
   it('emits telemetry for `next lint`', async () => {
-    await fs.writeFile(path.join(appDir, '.eslintrc'), `{ "extends": "next" }`)
+    await fs.writeFile(
+      path.join(appDir, '.eslintrc'),
+      `{ "root": true, "extends": "next" }`
+    )
     const { stderr } = await nextLint(appDir, [], {
       stderr: true,
       env: { NEXT_TELEMETRY_DEBUG: 1 },