[ESLint] Remove error when file patterns are unmatched + ESLint setup changes

.eslintignore

@@ -6,6 +6,10 @@ e2e-tests/**
 examples/with-eslint/**
 examples/with-typescript-eslint-jest/**
 examples/with-kea/**
+examples/with-custom-babel-config/**
+examples/with-flow/**
+examples/with-mobx-state-tree/**
+examples/with-mobx/**
 packages/next/bundles/webpack/packages/*.runtime.js
 packages/next/compiled/**/*
 packages/react-refresh-utils/**/*.js
@@ -18,6 +22,5 @@ packages/next-codemod/**/*.js
 packages/next-codemod/**/*.d.ts
 packages/next-env/**/*.d.ts
 packages/create-next-app/templates/**
-test/integration/async-modules/**
 test/integration/eslint/**
 test-timings.json

.eslintrc.json

@@ -1,6 +1,6 @@
 {
   "root": true,
-  "parser": "babel-eslint",
+  "parser": "@babel/eslint-parser",
   "plugins": ["react", "react-hooks", "jest", "import"],
   "env": {
     "browser": true,
@@ -9,10 +9,17 @@
     "node": true
   },
   "parserOptions": {
-    "ecmaVersion": 2018,
+    "requireConfigFile": false,
     "sourceType": "module",
     "ecmaFeatures": {
       "jsx": true
+    },
+    "babelOptions": {
+      "presets": ["@babel/preset-env", "@babel/preset-react"],
+      "caller": {
+        // Eslint supports top level await when a parser for it is included. We enable the parser by default for Babel.
+        "supportsTopLevelAwait": true
+      }
     }
   },
   "settings": {

examples/with-flow/.eslintrc.json

@@ -1,3 +1,3 @@
 {
-  "parser": "babel-eslint"
+  "extends": "next"
 }

examples/with-flow/package.json

@@ -12,7 +12,8 @@
     "react-dom": "^17.0.2"
   },
   "devDependencies": {
-    "babel-eslint": "8.2.6",
+    "eslint": "7.30.0",
+    "eslint-config-next": "latest",
     "babel-plugin-transform-flow-strip-types": "6.22.0",
     "flow-bin": "0.77.0"
   }

package.json

@@ -40,6 +40,7 @@
   },
   "pre-commit": "lint-staged",
   "devDependencies": {
+    "@babel/eslint-parser": "7.14.7",
     "@babel/plugin-proposal-object-rest-spread": "7.12.1",
     "@babel/preset-flow": "7.12.1",
     "@babel/preset-react": "7.12.10",
@@ -62,7 +63,6 @@
     "amphtml-validator": "1.0.33",
     "async-sema": "3.0.1",
     "babel-core": "7.0.0-bridge.0",
-    "babel-eslint": "10.0.3",
     "babel-jest": "27.0.0-next.5",
     "browserslist": "^4.14.7",
     "browserstack-local": "1.4.0",

packages/eslint-config-next/index.js

@@ -32,6 +32,10 @@ module.exports = {
     allowImportExportEverywhere: true,
     babelOptions: {
       presets: ['next/babel'],
+      caller: {
+        // Eslint supports top level await when a parser for it is included. We enable the parser by default for Babel.
+        supportsTopLevelAwait: true,
+      },
     },
   },
   overrides: [

packages/next/cli/next-lint.ts

@@ -28,7 +28,9 @@ const eslintOptions = (args: arg.Spec) => ({
     args['--report-unused-disable-directives'] || null,
   cache: args['--cache'] ?? false,
   cacheLocation: args['--cache-location'] || '.eslintcache',
-  errorOnUnmatchedPattern: !Boolean(args['--no-error-on-unmatched-pattern']),
+  errorOnUnmatchedPattern: args['--error-on-unmatched-pattern']
+    ? Boolean(args['--error-on-unmatched-pattern'])
+    : false,
 })
 
 const nextLint: cliCommand = (argv) => {
@@ -60,7 +62,7 @@ const nextLint: cliCommand = (argv) => {
     '--report-unused-disable-directives': String,
     '--cache': Boolean,
     '--cache-location': String,
-    '--no-error-on-unmatched-pattern': Boolean,
+    '--error-on-unmatched-pattern': Boolean,
 
     // Aliases
     '-c': '--config',
@@ -120,7 +122,7 @@ const nextLint: cliCommand = (argv) => {
           --cache-location path::String  Path to the cache file or directory - default: .eslintcache
 
         Miscellaneous:
-          --no-error-on-unmatched-pattern  Prevent errors when pattern is unmatched - default: false
+          --error-on-unmatched-pattern   Show errors when any file patterns are unmatched - default: false
           `,
       0
     )

packages/next/lib/eslint/runLintCheck.ts

@@ -64,6 +64,7 @@ async function lint(
   let options: any = {
     useEslintrc: true,
     baseConfig: {},
+    errorOnUnmatchedPattern: false,
     extensions: ['.js', '.jsx', '.ts', '.tsx'],
     ...eslintOptions,
   }

test/.eslintrc.json

@@ -0,0 +1,16 @@
+{
+  "extends": ["next"],
+  "rules": {
+    "import/no-anonymous-default-export": "off",
+    "react/display-name": "off",
+    "@next/next/no-img-element": "off",
+    "jsx-a11y/alt-text": "off",
+    "@next/next/no-css-tags": "off",
+    "@next/next/no-page-custom-font": "off",
+    "@next/next/no-sync-scripts": "off",
+    "react/no-unescaped-entities": "off",
+    "@next/next/no-html-link-for-pages": "off",
+    "react/no-unknown-property": "off",
+    "@next/next/google-font-display": "off"
+  }
+}

test/integration/client-navigation/pages/nav/pass-href-prop.js

@@ -18,6 +18,7 @@ export default () => (
       <FakeA id="with-href">Will redirect as an `a` tag</FakeA>
     </Link>
 
+    {/* eslint-disable-next-line @next/next/link-passhref */}
     <Link href="/nav">
       <FakeA id="without-href">Will not redirect as an `a` tag</FakeA>
     </Link>

test/integration/css-fixtures/next-issue-12343/pages/another-page.js

@@ -5,7 +5,7 @@ function AnotherPage() {
   return (
     <div>
       <h1>Another page</h1>
-      <Link href="/">
+      <Link href="/" passHref>
         <Button id="link-index">Another Button instance</Button>
       </Link>
     </div>

test/integration/css-fixtures/next-issue-12343/pages/index.js

@@ -6,7 +6,7 @@ function HomePage() {
   return (
     <div>
       <h1>Home page</h1>
-      <Link href="/another-page">
+      <Link href="/another-page" passHref>
         <Button id="link-other" className={styles.button}>
           Another page
         </Button>

test/integration/document-head-warnings/pages/_document.js

@@ -1,3 +1,5 @@
+/* eslint-disable @next/next/no-title-in-document-head */
+
 import Document, { Html, Head, Main, NextScript } from 'next/document'
 
 class MyDocument extends Document {

test/integration/eslint/empty-directory/.eslintrc

@@ -0,0 +1,8 @@
+{
+  "extends": "next",
+  "root": true,
+  "rules": {
+    "@next/next/no-html-link-for-pages": 0,
+    "@next/next/no-sync-scripts": 1
+  }
+}

test/integration/eslint/empty-directory/pages/index.js

@@ -0,0 +1,8 @@
+const Home = () => (
+  <div>
+    <p>Home</p>
+    <script src="https://example.com" />
+  </div>
+)
+
+export default Home

test/integration/eslint/eslint-ignore/.eslintrc

@@ -0,0 +1,9 @@
+{
+  "extends": "next",
+  "root": true,
+  "rules": {
+    "@next/next/no-html-link-for-pages": 0,
+    "@next/next/no-sync-scripts": 1
+  },
+  "ignorePatterns": ["**/components/**"]
+}

test/integration/eslint/eslint-ignore/components/a.js

@@ -0,0 +1,8 @@
+const A = () => (
+  <div>
+    <p>A Component</p>
+    /* Test */
+  </div>
+)
+
+export default A

test/integration/eslint/eslint-ignore/pages/index.js

@@ -0,0 +1,8 @@
+const Home = () => (
+  <div>
+    <p>Home</p>
+    <script src="https://example.com" />
+  </div>
+)
+
+export default Home

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

@@ -13,6 +13,8 @@ const dirCustomDirectories = join(__dirname, '../custom-directories')
 const dirConfigInPackageJson = join(__dirname, '../config-in-package-json')
 const dirInvalidEslintVersion = join(__dirname, '../invalid-eslint-version')
 const dirMaxWarnings = join(__dirname, '../max-warnings')
+const dirEmptyDirectory = join(__dirname, '../empty-directory')
+const dirEslintIgnore = join(__dirname, '../eslint-ignore')
 
 describe('ESLint', () => {
   describe('Next Build', () => {
@@ -90,6 +92,36 @@ describe('ESLint', () => {
         'Your project has an older version of ESLint installed'
       )
     })
+
+    test('empty directories do not fail the build', async () => {
+      const { stdout, stderr } = await nextBuild(dirEmptyDirectory, [], {
+        stdout: true,
+        stderr: true,
+      })
+
+      const output = stdout + stderr
+      expect(output).not.toContain('Build error occurred')
+      expect(output).not.toContain('NoFilesFoundError')
+      expect(output).toContain(
+        'Warning: External synchronous scripts are forbidden'
+      )
+      expect(output).toContain('Compiled successfully')
+    })
+
+    test('eslint ignored directories do not fail the build', async () => {
+      const { stdout, stderr } = await nextBuild(dirEslintIgnore, [], {
+        stdout: true,
+        stderr: true,
+      })
+
+      const output = stdout + stderr
+      expect(output).not.toContain('Build error occurred')
+      expect(output).not.toContain('AllFilesIgnoredError')
+      expect(output).toContain(
+        'Warning: External synchronous scripts are forbidden'
+      )
+      expect(output).toContain('Compiled successfully')
+    })
   })
 
   describe('Next Lint', () => {