Fix ESLint Ignores and Extract Fn (#10205)

.eslintrc.json

@@ -61,6 +61,15 @@
             "ignoreRestSiblings": true
           }
         ],
+        "no-unused-expressions": "off",
+        "@typescript-eslint/no-unused-expressions": [
+          "error",
+          {
+            "allowShortCircuit": true,
+            "allowTernary": true,
+            "allowTaggedTemplates": true
+          }
+        ],
         "no-useless-constructor": "off",
         "@typescript-eslint/no-useless-constructor": "warn"
       }

package.json

@@ -42,8 +42,8 @@
     "@mdx-js/loader": "0.18.0",
     "@types/jest": "24.0.13",
     "@types/string-hash": "1.1.1",
-    "@typescript-eslint/eslint-plugin": "2.6.1",
-    "@typescript-eslint/parser": "2.6.1",
+    "@typescript-eslint/eslint-plugin": "2.17.0",
+    "@typescript-eslint/parser": "2.17.0",
     "@zeit/next-css": "1.0.2-canary.2",
     "@zeit/next-sass": "1.0.2-canary.2",
     "@zeit/next-typescript": "1.1.2-canary.0",
@@ -60,9 +60,9 @@
     "cross-env": "6.0.3",
     "cross-spawn": "6.0.5",
     "escape-string-regexp": "2.0.0",
-    "eslint": "6.6.0",
-    "eslint-plugin-react": "7.16.0",
-    "eslint-plugin-react-hooks": "2.2.0",
+    "eslint": "6.8.0",
+    "eslint-plugin-react": "7.18.0",
+    "eslint-plugin-react-hooks": "2.3.0",
     "execa": "2.0.3",
     "express": "4.17.0",
     "faunadb": "2.6.1",

packages/next/build/webpack-config.ts

@@ -28,7 +28,7 @@ import {
   VALID_MIDDLEWARE,
 } from './plugins/collect-plugins'
 import { build as buildConfiguration } from './webpack/config'
-import { __overrideCssConfiguration } from './webpack/config/blocks/css'
+import { __overrideCssConfiguration } from './webpack/config/blocks/css/overrideCssConfiguration'
 // @ts-ignore: JS file
 import { pluginLoaderOptions } from './webpack/loaders/next-plugin-loader'
 import BuildManifestPlugin from './webpack/plugins/build-manifest-plugin'

packages/next/build/webpack/config/blocks/css/index.ts

@@ -1,6 +1,6 @@
 import curry from 'lodash.curry'
 import path from 'path'
-import webpack, { Configuration, RuleSetRule } from 'webpack'
+import webpack, { Configuration } from 'webpack'
 import MiniCssExtractPlugin from '../../../plugins/mini-css-extract-plugin'
 import { loader, plugin } from '../../helpers'
 import { ConfigurationContext, ConfigurationFn, pipe } from '../../utils'
@@ -69,38 +69,6 @@ function getClientStyleLoader({
       }
 }
 
-export async function __overrideCssConfiguration(
-  rootDirectory: string,
-  isProduction: boolean,
-  config: Configuration
-) {
-  const postCssPlugins = await getPostCssPlugins(rootDirectory, isProduction)
-
-  function patch(rule: RuleSetRule) {
-    if (
-      rule.options &&
-      typeof rule.options === 'object' &&
-      rule.options['ident'] === '__nextjs_postcss'
-    ) {
-      rule.options.plugins = postCssPlugins
-    } else if (Array.isArray(rule.oneOf)) {
-      rule.oneOf.forEach(patch)
-    } else if (Array.isArray(rule.use)) {
-      rule.use.forEach(u => {
-        if (typeof u === 'object') {
-          patch(u)
-        }
-      })
-    }
-  }
-
-  // TODO: remove this rule, ESLint bug
-  // eslint-disable-next-line no-unused-expressions
-  config.module?.rules?.forEach(entry => {
-    patch(entry)
-  })
-}
-
 export const css = curry(async function css(
   enabled: boolean,
   ctx: ConfigurationContext,

packages/next/build/webpack/config/blocks/css/overrideCssConfiguration.ts

@@ -0,0 +1,32 @@
+import { Configuration, RuleSetRule } from 'webpack'
+import { getPostCssPlugins } from './plugins'
+
+export async function __overrideCssConfiguration(
+  rootDirectory: string,
+  isProduction: boolean,
+  config: Configuration
+) {
+  const postCssPlugins = await getPostCssPlugins(rootDirectory, isProduction)
+
+  function patch(rule: RuleSetRule) {
+    if (
+      rule.options &&
+      typeof rule.options === 'object' &&
+      rule.options['ident'] === '__nextjs_postcss'
+    ) {
+      rule.options.plugins = postCssPlugins
+    } else if (Array.isArray(rule.oneOf)) {
+      rule.oneOf.forEach(patch)
+    } else if (Array.isArray(rule.use)) {
+      rule.use.forEach(u => {
+        if (typeof u === 'object') {
+          patch(u)
+        }
+      })
+    }
+  }
+
+  config.module?.rules?.forEach(entry => {
+    patch(entry)
+  })
+}

packages/next/build/webpack/loaders/error-loader.ts

@@ -8,11 +8,7 @@ const ErrorLoader: loader.Loader = function() {
 
   const { reason = 'An unknown error has occurred' } = options
 
-  // TODO: remove this ignore -- currently an ESLint bug
-  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   const resource = this._module?.issuer?.resource ?? null
-  // TODO: remove this ignore -- currently an ESLint bug
-  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   const context = this.rootContext ?? this._compiler?.context
 
   const issuer = resource

test/integration/typescript/components/router.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-unused-expressions */
+/* eslint-disable no-unused-expressions, @typescript-eslint/no-unused-expressions */
 import React from 'react'
 import Router, { withRouter } from 'next/router'