Merge branch 'canary' into get-static-props-amp-fix

.eslintignore

@@ -13,4 +13,5 @@ packages/next-codemod/transforms/__testfixtures__/**/*
 packages/next-codemod/transforms/__tests__/**/*
 packages/next-codemod/**/*.js
 packages/next-codemod/**/*.d.ts
-packages/next-env/**/*.d.ts
+packages/next-env/**/*.d.ts
+test/integration/async-modules/**

.github/workflows/build_test_deploy.yml

@@ -113,6 +113,7 @@ jobs:
       - run: yarn install --check-files
       - run: node run-tests.js test/integration/production/test/index.test.js
       - run: node run-tests.js test/integration/basic/test/index.test.js
+      - run: node run-tests.js test/integration/async-modules/test/index.test.js
       - run: node run-tests.js test/integration/font-optimization/test/index.test.js
       - run: node run-tests.js test/acceptance/*
 

docs/migrating/from-gatsby.md

@@ -84,10 +84,10 @@ import { getPostBySlug, getAllPosts } from '../lib/blog'
 
 export async function getStaticProps({ params }) {
   const post = getPostBySlug(params.slug)
-  const content = await remark()
+  const markdown = await remark()
     .use(html)
     .process(post.content || '')
-    .toString()
+  const content = markdown.toString()
 
   return {
     props: {
@@ -128,7 +128,7 @@ import { join } from 'path'
 const postsDirectory = join(process.cwd(), 'src', 'content', 'blog')
 
 export function getPostBySlug(slug) {
-  const realSlug = slug.replace(/\\.md$/, '')
+  const realSlug = slug.replace(/\.md$/, '')
   const fullPath = join(postsDirectory, `${realSlug}.md`)
   const fileContents = fs.readFileSync(fullPath, 'utf8')
   const { data, content } = matter(fileContents)

lerna.json

@@ -17,5 +17,5 @@
       "registry": "https://registry.npmjs.org/"
     }
   },
-  "version": "9.5.5"
+  "version": "9.5.6-canary.0"
 }

package.json

@@ -98,6 +98,7 @@
     "npm-run-all": "4.1.5",
     "nprogress": "0.2.0",
     "pixrem": "5.0.0",
+    "pnpm": "5.8.0",
     "postcss-nested": "4.2.1",
     "postcss-pseudoelements": "5.0.0",
     "postcss-short-size": "4.0.0",

packages/create-next-app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-next-app",
-  "version": "9.5.5",
+  "version": "9.5.6-canary.0",
   "keywords": [
     "react",
     "next",

packages/eslint-plugin-next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/eslint-plugin-next",
-  "version": "9.5.5",
+  "version": "9.5.6-canary.0",
   "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": "9.5.5",
+  "version": "9.5.6-canary.0",
   "main": "index.js",
   "license": "MIT",
   "repository": {

packages/next-codemod/package.json

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

packages/next-env/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/env",
-  "version": "9.5.5",
+  "version": "9.5.6-canary.0",
   "keywords": [
     "react",
     "next",

packages/next-mdx/package.json

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

packages/next-plugin-google-analytics/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-google-analytics",
-  "version": "9.5.5",
+  "version": "9.5.6-canary.0",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/next-plugin-google-analytics"

packages/next-plugin-sentry/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-sentry",
-  "version": "9.5.5",
+  "version": "9.5.6-canary.0",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/next-plugin-sentry"

packages/next-plugin-storybook/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/plugin-storybook",
-  "version": "9.5.5",
+  "version": "9.5.6-canary.0",
   "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": "9.5.5",
+  "version": "9.5.6-canary.0",
   "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": "9.5.5",
+  "version": "9.5.6-canary.0",
   "description": "A polyfill for non-dead, nomodule browsers.",
   "main": "dist/polyfill-nomodule.js",
   "license": "MIT",

packages/next/build/index.ts

@@ -531,7 +531,7 @@ export default async function build(
         const serverBundle = getPagePath(page, distDir, isLikeServerless)
 
         if (customAppGetInitialProps === undefined) {
-          customAppGetInitialProps = hasCustomGetInitialProps(
+          customAppGetInitialProps = await hasCustomGetInitialProps(
             isLikeServerless
               ? serverBundle
               : getPagePath('/_app', distDir, isLikeServerless),

packages/next/build/plugins/collect-plugins.ts

@@ -19,8 +19,6 @@ export const VALID_MIDDLEWARE = [
   'document-head-tags-server',
   'on-init-client',
   'on-init-server',
-  'on-error-server',
-  'on-error-client',
   'on-error-client',
   'on-error-server',
   'babel-preset-build',

packages/next/build/utils.ts

@@ -704,21 +704,21 @@ export async function isPageStatic(
 }> {
   try {
     require('../next-server/lib/runtime-config').setConfig(runtimeEnvConfig)
-    const mod = require(serverBundle)
-    const Comp = mod.default || mod
+    const mod = await require(serverBundle)
+    const Comp = await (mod.default || mod)
 
     if (!Comp || !isValidElementType(Comp) || typeof Comp === 'string') {
       throw new Error('INVALID_DEFAULT_EXPORT')
     }
 
     const hasGetInitialProps = !!(Comp as any).getInitialProps
-    const hasStaticProps = !!mod.getStaticProps
-    const hasStaticPaths = !!mod.getStaticPaths
-    const hasServerProps = !!mod.getServerSideProps
-    const hasLegacyServerProps = !!mod.unstable_getServerProps
-    const hasLegacyStaticProps = !!mod.unstable_getStaticProps
-    const hasLegacyStaticPaths = !!mod.unstable_getStaticPaths
-    const hasLegacyStaticParams = !!mod.unstable_getStaticParams
+    const hasStaticProps = !!(await mod.getStaticProps)
+    const hasStaticPaths = !!(await mod.getStaticPaths)
+    const hasServerProps = !!(await mod.getServerSideProps)
+    const hasLegacyServerProps = !!(await mod.unstable_getServerProps)
+    const hasLegacyStaticProps = !!(await mod.unstable_getStaticProps)
+    const hasLegacyStaticPaths = !!(await mod.unstable_getStaticPaths)
+    const hasLegacyStaticParams = !!(await mod.unstable_getStaticParams)
 
     if (hasLegacyStaticParams) {
       throw new Error(
@@ -804,19 +804,20 @@ export async function isPageStatic(
   }
 }
 
-export function hasCustomGetInitialProps(
+export async function hasCustomGetInitialProps(
   bundle: string,
   runtimeEnvConfig: any,
   checkingApp: boolean
-): boolean {
+): Promise<boolean> {
   require('../next-server/lib/runtime-config').setConfig(runtimeEnvConfig)
   let mod = require(bundle)
 
   if (checkingApp) {
-    mod = mod._app || mod.default || mod
+    mod = (await mod._app) || mod.default || mod
   } else {
     mod = mod.default || mod
   }
+  mod = await mod
   return mod.getInitialProps !== mod.origGetInitialProps
 }
 

packages/next/build/webpack-config.ts

@@ -1,7 +1,7 @@
 import { codeFrameColumns } from '@babel/code-frame'
 import ReactRefreshWebpackPlugin from '@next/react-refresh-utils/ReactRefreshWebpackPlugin'
 import crypto from 'crypto'
-import { readFileSync } from 'fs'
+import { readFileSync, realpathSync } from 'fs'
 import chalk from 'next/dist/compiled/chalk'
 import semver from 'next/dist/compiled/semver'
 import TerserPlugin from 'next/dist/compiled/terser-webpack-plugin'
@@ -229,6 +229,25 @@ export default async function getBaseWebpackConfig(
     }
   }
 
+  if (config.images?.hosts) {
+    if (!config.images.hosts.default) {
+      // If the image component is being used, a default host must be provided
+      throw new Error(
+        'If the image configuration property is present in next.config.js, it must have a host named "default"'
+      )
+    }
+    Object.values(config.images.hosts).forEach((host: any) => {
+      if (!host.path) {
+        throw new Error(
+          'All hosts defined in the image configuration property of next.config.js must define a path'
+        )
+      }
+      // Normalize hosts so all paths have trailing slash
+      if (host.path[host.path.length - 1] !== '/') {
+        host.path += '/'
+      }
+    })
+  }
   const reactVersion = await getPackageVersion({ cwd: dir, name: 'react' })
   const hasReactRefresh: boolean = dev && !isServer
   const hasJsxRuntime: boolean =
@@ -583,6 +602,7 @@ export default async function getBaseWebpackConfig(
       'next/app',
       'next/document',
       'next/link',
+      'next/image',
       'next/error',
       'string-hash',
       'next/constants',
@@ -665,7 +685,12 @@ export default async function getBaseWebpackConfig(
       // Same as above: if the package, when required from the root,
       // would be different from what the real resolution would use, we
       // cannot externalize it.
-      if (baseRes !== res) {
+      if (
+        !baseRes ||
+        (baseRes !== res &&
+          // if res and baseRes are symlinks they could point to the the same file
+          realpathSync(baseRes) !== realpathSync(res))
+      ) {
         return callback()
       }
     }
@@ -984,6 +1009,7 @@ export default async function getBaseWebpackConfig(
         'process.env.__NEXT_SCROLL_RESTORATION': JSON.stringify(
           config.experimental.scrollRestoration
         ),
+        'process.env.__NEXT_IMAGE_OPTS': JSON.stringify(config.images),
         'process.env.__NEXT_ROUTER_BASEPATH': JSON.stringify(config.basePath),
         'process.env.__NEXT_HAS_REWRITES': JSON.stringify(hasRewrites),
         'process.env.__NEXT_i18n_SUPPORT': JSON.stringify(