Merge branch 'canary' into shu/e898

lerna.json

@@ -16,5 +16,5 @@
       "registry": "https://registry.npmjs.org/"
     }
   },
-  "version": "12.1.1-canary.1"
+  "version": "12.1.1-canary.2"
 }

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

@@ -234,7 +234,12 @@ export async function createApp({
      * TypeScript projects will have type definitions and other devDependencies.
      */
     if (typescript) {
-      devDependencies.push('typescript', '@types/react', '@types/node')
+      devDependencies.push(
+        'typescript',
+        '@types/react',
+        '@types/node',
+        '@types/react-dom'
+      )
     }
     /**
      * Install package.json dependencies if they exist.

packages/create-next-app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-next-app",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "keywords": [
     "react",
     "next",

packages/eslint-config-next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-config-next",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "description": "ESLint configuration used by NextJS.",
   "main": "index.js",
   "license": "MIT",
@@ -9,7 +9,7 @@
     "directory": "packages/eslint-config-next"
   },
   "dependencies": {
-    "@next/eslint-plugin-next": "12.1.1-canary.1",
+    "@next/eslint-plugin-next": "12.1.1-canary.2",
     "@rushstack/eslint-patch": "^1.0.8",
     "@typescript-eslint/parser": "^5.0.0",
     "eslint-import-resolver-node": "^0.3.4",

packages/eslint-plugin-next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/eslint-plugin-next",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "description": "ESLint plugin for NextJS.",
   "main": "lib/index.js",
   "license": "MIT",

packages/next-bundle-analyzer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/bundle-analyzer",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "main": "index.js",
   "license": "MIT",
   "repository": {

packages/next-codemod/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/codemod",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "license": "MIT",
   "dependencies": {
     "chalk": "4.1.0",

packages/next-env/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/env",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "keywords": [
     "react",
     "next",

packages/next-mdx/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/mdx",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "main": "index.js",
   "license": "MIT",
   "repository": {

packages/next-plugin-storybook/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-storybook",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/next-plugin-storybook"

packages/next-polyfill-module/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/polyfill-module",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "description": "A standard library polyfill for ES Modules supporting browsers (Edge 16+, Firefox 60+, Chrome 61+, Safari 10.1+)",
   "main": "dist/polyfill-module.js",
   "license": "MIT",

packages/next-polyfill-nomodule/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/polyfill-nomodule",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "description": "A polyfill for non-dead, nomodule browsers.",
   "main": "dist/polyfill-nomodule.js",
   "license": "MIT",

packages/next-swc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/swc",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "private": true,
   "scripts": {
     "build-native": "napi build --platform --cargo-name next_swc_napi native",

packages/next/build/webpack-config.ts

@@ -51,6 +51,7 @@ import { getRawPageExtensions } from './utils'
 import browserslist from 'next/dist/compiled/browserslist'
 import loadJsConfig from './load-jsconfig'
 import { shouldUseReactRoot } from '../server/config'
+import { getMiddlewareSourceMapPlugins } from './webpack/plugins/middleware-source-maps-plugin'
 
 const watchOptions = Object.freeze({
   aggregateTimeout: 5,
@@ -1272,6 +1273,12 @@ export default async function getBaseWebpackConfig(
       ].filter(Boolean),
     },
     plugins: [
+      ...(!dev &&
+      !isServer &&
+      !!config.experimental.middlewareSourceMaps &&
+      !config.productionBrowserSourceMaps
+        ? getMiddlewareSourceMapPlugins()
+        : []),
       hasReactRefresh && new ReactRefreshWebpackPlugin(webpack),
       // Makes sure `Buffer` and `process` are polyfilled in client and flight bundles (same behavior as webpack 4)
       targetWeb &&

packages/next/build/webpack/plugins/middleware-source-maps-plugin.ts

@@ -0,0 +1,38 @@
+import { webpack } from 'next/dist/compiled/webpack/webpack'
+import type { webpack5 } from 'next/dist/compiled/webpack/webpack'
+
+/**
+ * Produce source maps for middlewares.
+ * Currently we use the same compiler for browser and middlewares,
+ */
+export const getMiddlewareSourceMapPlugins = () => {
+  return [
+    new webpack.SourceMapDevToolPlugin({
+      filename: '[file].map',
+      include: [
+        // Middlewares are the only ones who have `server/pages/[name]` as their filename
+        /^server\/pages\//,
+        // All middleware chunks
+        /^server\/middleware-chunks\//,
+      ],
+    }),
+    new MiddlewareSourceMapsPlugin(),
+  ]
+}
+
+/**
+ * Produce source maps for middlewares.
+ * Currently we use the same compiler for browser and middlewares,
+ * so we can avoid having the custom plugins if the browser source maps
+ * are emitted.
+ */
+class MiddlewareSourceMapsPlugin {
+  apply(compiler: webpack5.Compiler): void {
+    const PLUGIN_NAME = 'NextJsMiddlewareSourceMapsPlugin'
+    compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation) => {
+      compilation.hooks.buildModule.tap(PLUGIN_NAME, (module) => {
+        module.useSourceMap = module.layer === 'middleware'
+      })
+    })
+  }
+}

packages/next/lib/eslint/runLintCheck.ts

@@ -25,6 +25,14 @@ type Config = {
   rules: { [key: string]: Array<number | string> }
 }
 
+// 0 is off, 1 is warn, 2 is error. See https://eslint.org/docs/user-guide/configuring/rules#configuring-rules
+const VALID_SEVERITY = ['off', 'warn', 'error'] as const
+type Severity = typeof VALID_SEVERITY[number]
+
+function isValidSeverity(severity: string): severity is Severity {
+  return VALID_SEVERITY.includes(severity as Severity)
+}
+
 const requiredPackages = [
   { file: 'eslint', pkg: 'eslint' },
   { file: 'eslint-config-next', pkg: 'eslint-config-next' },
@@ -126,6 +134,7 @@ async function lint(
     let eslint = new ESLint(options)
 
     let nextEslintPluginIsEnabled = false
+    const nextRulesEnabled = new Map<string, Severity>()
     const pagesDirRules = ['@next/next/no-html-link-for-pages']
 
     for (const configFile of [eslintrcFile, pkgJsonPath]) {
@@ -137,6 +146,23 @@ async function lint(
 
       if (completeConfig.plugins?.includes('@next/next')) {
         nextEslintPluginIsEnabled = true
+        for (const [name, [severity]] of Object.entries(completeConfig.rules)) {
+          if (!name.startsWith('@next/next/')) {
+            continue
+          }
+          if (
+            typeof severity === 'number' &&
+            severity >= 0 &&
+            severity < VALID_SEVERITY.length
+          ) {
+            nextRulesEnabled.set(name, VALID_SEVERITY[severity])
+          } else if (
+            typeof severity === 'string' &&
+            isValidSeverity(severity)
+          ) {
+            nextRulesEnabled.set(name, severity)
+          }
+        }
         break
       }
     }
@@ -210,6 +236,7 @@ async function lint(
         nextEslintPluginErrorsCount: formattedResult.totalNextPluginErrorCount,
         nextEslintPluginWarningsCount:
           formattedResult.totalNextPluginWarningCount,
+        nextRulesEnabled: Object.fromEntries(nextRulesEnabled),
       },
     }
   } catch (err) {

packages/next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next",
-  "version": "12.1.1-canary.1",
+  "version": "12.1.1-canary.2",
   "description": "The React Framework",
   "main": "./dist/server/next.js",
   "license": "MIT",
@@ -69,7 +69,7 @@
     ]
   },
   "dependencies": {
-    "@next/env": "12.1.1-canary.1",
+    "@next/env": "12.1.1-canary.2",
     "caniuse-lite": "^1.0.30001283",
     "postcss": "8.4.5",
     "styled-jsx": "5.0.0",
@@ -116,12 +116,12 @@
     "@babel/types": "7.15.0",
     "@hapi/accept": "5.0.2",
     "@napi-rs/cli": "2.4.4",
-    "@napi-rs/triples": "1.0.3",
-    "@next/polyfill-module": "12.1.1-canary.1",
-    "@next/polyfill-nomodule": "12.1.1-canary.1",
-    "@next/react-dev-overlay": "12.1.1-canary.1",
-    "@next/react-refresh-utils": "12.1.1-canary.1",
-    "@next/swc": "12.1.1-canary.1",
+    "@napi-rs/triples": "1.1.0",
+    "@next/polyfill-module": "12.1.1-canary.2",
+    "@next/polyfill-nomodule": "12.1.1-canary.2",
+    "@next/react-dev-overlay": "12.1.1-canary.2",
+    "@next/react-refresh-utils": "12.1.1-canary.2",
+    "@next/swc": "12.1.1-canary.2",
     "@peculiar/webcrypto": "1.1.7",
     "@taskr/clear": "1.1.0",
     "@taskr/esnext": "1.1.0",