Squashed commit of the following:

commit f16ee05
Author: hiro <hiroyuki.kikuchi@zozo.com>
Date:   Thu Mar 24 10:02:40 2022 +0900

    Fix typo in docs (vercel#35561)

    The following files have been modified.

    - `docs/api-reference/next.config.js/rewrites.md`
    - `docs/basic-features/script.md`

    ## Documentation / Examples

    - [x] Make sure the linting passes by running `yarn lint`

commit ef7b535
Author: Steven <steven@ceriously.com>
Date:   Wed Mar 23 18:33:47 2022 -0400

    Fix `next info` accidentally printing stderr (vercel#35556)

    I noticed a few issues that had "Output from `next info`" with the first line as

    ```
    /bin/sh: pnpm: command not found
    ```

    This was because `execSync()` was still printing to stderr when a command was not found.

    Changing to `execFileSync()` fixed it so we no longer print to stderr when a command is not found.

commit 59905c1
Author: LongYinan <lynweklm@gmail.com>
Date:   Thu Mar 24 04:47:44 2022 +0800

    Fix styled transform in next-swc/emotion (vercel#35527)

    Fix vercel#35525

    ## Bug

    - [x] Related issues linked using `fixes #number`
    - [ ] Integration tests added
    - [ ] Errors have helpful link attached, see `contributing.md`

    ## Feature

    - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
    - [ ] Related issues linked using `fixes #number`
    - [ ] Integration tests added
    - [ ] Documentation added
    - [ ] Telemetry added. In case of a feature if it's used or not.
    - [ ] Errors have helpful link attached, see `contributing.md`

    ## Documentation / Examples

    - [ ] Make sure the linting passes by running `yarn lint`

commit ebe1b4c
Author: Shu Ding <g@shud.in>
Date:   Wed Mar 23 20:20:36 2022 +0100

    Upgrade react-server-dom-webpack (vercel#35524)

    There're some changes since our last update that we'll need (e.g. server context).

    ## Bug

    - [ ] Related issues linked using `fixes #number`
    - [ ] Integration tests added
    - [ ] Errors have helpful link attached, see `contributing.md`

    ## Feature

    - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
    - [ ] Related issues linked using `fixes #number`
    - [ ] Integration tests added
    - [ ] Documentation added
    - [ ] Telemetry added. In case of a feature if it's used or not.
    - [ ] Errors have helpful link attached, see `contributing.md`

    ## Documentation / Examples

    - [ ] Make sure the linting passes by running `yarn lint`

commit 432261a
Author: JJ Kasper <jj@jjsweb.site>
Date:   Wed Mar 23 13:43:12 2022 -0500

    Add link for revalidate from notFound section (vercel#35553)

commit 2cf6696
Author: Jiachi Liu <inbox@huozhi.im>
Date:   Wed Mar 23 16:19:58 2022 +0100

    Merge rsc queries handling (vercel#35545)

    Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

commit 9fef0d5
Author: JJ Kasper <jj@jjsweb.site>
Date:   Wed Mar 23 09:28:04 2022 -0500

    Normalize ssgCacheKey for /index with minimalMode de-duping (vercel#35536)

    * Normalize ssgCacheKey for /index

    * apply test changes to i18n suite as well

commit 72478c5
Author: JJ Kasper <jj@jjsweb.site>
Date:   Tue Mar 22 13:58:55 2022 -0500

    Update next/link error when no children are provided (vercel#35453)

    * Update next/link error when no children are provided

    * update manifest

    * Apply suggestions from code review

    Co-authored-by: Balázs Orbán <info@balazsorban.com>

commit 6da7691
Author: Malte Ubl <cramforce@users.noreply.github.com>
Date:   Tue Mar 22 07:54:05 2022 -0700

    Reduce hello-world middleware bundle size from 128k to 88k (vercel#35512)

    Moves two utility functions from `server/router.ts` into their own file. This avoids the middleware pulling in the full Next.js router into its bundle.

    There are probably more opportunities like this, but this is a good start. Middleware should likely be bundled by a non-chunking optimizing compiler.

commit 860c97c
Author: Heyang Zhou <zhy20000919@hotmail.com>
Date:   Tue Mar 22 21:20:57 2022 +0800

    SWC import modularization plugin (vercel#34969)

commit 78831c3
Author: Steven <steven@ceriously.com>
Date:   Tue Mar 22 09:00:31 2022 -0400

    v12.1.1-canary.17

commit a2accb2
Author: JJ Kasper <jj@jjsweb.site>
Date:   Tue Mar 22 00:03:42 2022 -0500

    Update trace ignore check to check reasons correctly (vercel#35511)

commit c261924
Author: OJ Kwon <kwon.ohjoong@gmail.com>
Date:   Mon Mar 21 17:09:03 2022 -0700

    feat(telemetry): report swc target triple to telemetry (vercel#35420)

commit af95b0c
Author: Luka Hartwig <mail@lukahartwig.de>
Date:   Tue Mar 22 00:54:43 2022 +0100

    Server component docs use wrong next version (vercel#35313)

    The docs for the react server components preview refer refer to `next@latest` which doesn't work. The linked demo uses `canary` so I replaced it in the install command.

commit 92da36f
Author: JJ Kasper <jj@jjsweb.site>
Date:   Mon Mar 21 18:33:48 2022 -0500

    v12.1.1-canary.16

commit cd47984
Author: Thiago M <thiagotm@outlook.com>
Date:   Mon Mar 21 14:06:04 2022 -0300

    clarify use of Script (vercel#35491)

    Leave more clear that <Script> component can't be used inside Head. Current it says "without need", which don't implies it can't be used.

    ## Bug

    - [ ] Related issues linked using `fixes #number`
    - [ ] Integration tests added
    - [ ] Errors have helpful link attached, see `contributing.md`

    ## Feature

    - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
    - [ ] Related issues linked using `fixes #number`
    - [ ] Integration tests added
    - [ ] Documentation added
    - [ ] Telemetry added. In case of a feature if it's used or not.
    - [ ] Errors have helpful link attached, see `contributing.md`

    ## Documentation / Examples

    - [x] Make sure the linting passes by running `yarn lint`

commit da3760b
Author: JJ Kasper <jj@jjsweb.site>
Date:   Mon Mar 21 10:00:07 2022 -0500

    Use check on prerender test assertion (vercel#35482)

commit 40a5c94
Author: Nelo <correo@nelo.dev>
Date:   Mon Mar 21 15:24:19 2022 +0100

    Fix typo in getServerSideProps doc page (vercel#35467)

    While reading the documentation, I noticed that this paragraph was not correctly written and was hard to read. I fixed it adding a dot.

    ## Documentation / Examples

    - [ ] Make sure the linting passes by running `yarn lint`

docs/advanced-features/compiler.md

@@ -233,6 +233,89 @@ module.exports = {
 
 If you have feedback about `swcMinify`, please share it on the [feedback discussion](https://github.com/vercel/next.js/discussions/30237).
 
+### Modularize Imports
+
+Allows to modularize imports, similar to [babel-plugin-transform-imports](https://www.npmjs.com/package/babel-plugin-transform-imports).
+
+Transforms member style imports:
+
+```js
+import { Row, Grid as MyGrid } from 'react-bootstrap'
+import { merge } from 'lodash'
+```
+
+...into default style imports:
+
+```js
+import Row from 'react-bootstrap/lib/Row'
+import MyGrid from 'react-bootstrap/lib/Grid'
+import merge from 'lodash/merge'
+```
+
+Config for the above transform:
+
+```js
+// next.config.js
+module.exports = {
+  experimental: {
+    modularizeImports: {
+      'react-bootstrap': {
+        transform: 'react-bootstrap/lib/{{member}}',
+      },
+      lodash: {
+        transform: 'lodash/{{member}}',
+      },
+    },
+  },
+}
+```
+
+Advanced transformations:
+
+- Using regular expressions
+
+Similar to `babel-plugin-transform-imports`, but the transform is templated with [handlebars](https://docs.rs/handlebars) and regular expressions are in Rust [regex](https://docs.rs/regex/latest/regex/) crate's syntax.
+
+The config:
+
+```js
+// next.config.js
+module.exports = {
+  experimental: {
+    modularizeImports: {
+      'my-library/?(((\\w*)?/?)*)': {
+        transform: 'my-library/{{ matches.[1] }}/{{member}}',
+      },
+    },
+  },
+}
+```
+
+Cause this code:
+
+```js
+import { MyModule } from 'my-library'
+import { App } from 'my-library/components'
+import { Header, Footer } from 'my-library/components/App'
+```
+
+To become:
+
+```js
+import MyModule from 'my-library/MyModule'
+import App from 'my-library/components/App'
+import Header from 'my-library/components/App/Header'
+import Footer from 'my-library/components/App/Footer'
+```
+
+- Handlebars templating
+
+This transform uses [handlebars](https://docs.rs/handlebars) to template the replacement import path in the `transform` field. These variables and helper functions are available:
+
+1. `matches`: Has type `string[]`. All groups matched by the regular expression. `matches.[0]` is the full match.
+2. `member`: Has type `string`. The name of the member import.
+3. `lowerCase`, `upperCase`, `camelCase`: Helper functions to convert a string to lower, upper or camel cases.
+
 ## Unsupported Features
 
 When your application has a `.babelrc` file, Next.js will automatically fall back to using Babel for transforming individual files. This ensures backwards compatibility with existing applications that leverage custom Babel plugins.

docs/advanced-features/react-18/server-components.md

@@ -7,7 +7,7 @@ Server Components allow us to render React components on the server. This is fun
 To use React Server Components, ensure you have React 18 installed:
 
 ```jsx
-npm install next@latest react@rc react-dom@rc
+npm install next@canary react@rc react-dom@rc
 ```
 
 Then, update your `next.config.js`:

docs/api-reference/data-fetching/get-static-props.md

@@ -85,7 +85,7 @@ Learn more about [Incremental Static Regeneration](/docs/basic-features/data-fet
 
 ### `notFound`
 
-The `notFound` boolean allows the page to return a `404` status and [404 Page](/docs/advanced-features/custom-error-page.md#404-page). With `notFound: true`, the page will return a `404` even if there was a successfully generated page before. This is meant to support use cases like user-generated content getting removed by its author.
+The `notFound` boolean allows the page to return a `404` status and [404 Page](/docs/advanced-features/custom-error-page.md#404-page). With `notFound: true`, the page will return a `404` even if there was a successfully generated page before. This is meant to support use cases like user-generated content getting removed by its author. Note, `notFound` follows the same `revalidate` behavior [described here](/docs/api-reference/data-fetching/get-static-props.md#revalidate)
 
 ```js
 export async function getStaticProps(context) {

docs/api-reference/next.config.js/rewrites.md

@@ -323,7 +323,7 @@ module.exports = {
 }
 ```
 
-If you're using `trailingSlash: true`, you also need to insert a trailing slash in the `source` paramater. If the destination server is also expecting a trailing slash it should be included in the `destination` parameter as well.
+If you're using `trailingSlash: true`, you also need to insert a trailing slash in the `source` parameter. If the destination server is also expecting a trailing slash it should be included in the `destination` parameter as well.
 
 ```js
 module.exports = {

docs/basic-features/data-fetching/get-server-side-props.md

@@ -21,7 +21,7 @@ export async function getServerSideProps(context) {
 - When you request this page directly, `getServerSideProps` runs at request time, and this page will be pre-rendered with the returned props
 - When you request this page on client-side page transitions through [`next/link`](/docs/api-reference/next/link.md) or [`next/router`](/docs/api-reference/next/router.md), Next.js sends an API request to the server, which runs `getServerSideProps`
 
-It then returns `JSON` that contains the result of running `getServerSideProps`, that `JSON` will be used to render the page. All this work will be handled automatically by Next.js, so you don’t need to do anything extra as long as you have `getServerSideProps` defined.
+`getServerSideProps` returns JSON which will be used to render the page. All this work will be handled automatically by Next.js, so you don’t need to do anything extra as long as you have `getServerSideProps` defined.
 
 You can use the [next-code-elimination tool](https://next-code-elimination.vercel.app/) to verify what Next.js eliminates from the client-side bundle.
 

docs/basic-features/script.md

@@ -25,7 +25,7 @@ description: Next.js helps you optimize loading third-party scripts with the bui
 
 </details>
 
-The Next.js Script component, [`next/script`](/docs/api-reference/next/script.md), is an extension of the HTML `<script>` element. It enables developers to set the loading priority of third-party scripts anywhere in their application without needing to append directly to `next/head`, saving developer time while improving loading performance.
+The Next.js Script component, [`next/script`](/docs/api-reference/next/script.md), is an extension of the HTML `<script>` element. It enables developers to set the loading priority of third-party scripts anywhere in their application, outside `next/head`, saving developer time while improving loading performance.
 
 ```jsx
 import Script from 'next/script'
@@ -166,7 +166,7 @@ There are a number of trade-offs that need to be considered when loading a third
 
 Although the `worker` strategy does not require any additional configuration to work, Partytown supports the use of a config object to modify some of its settings, including enabling `debug` mode and forwarding events and triggers.
 
-If you would like to add additonal configuration options, you can include it within the `<Head />` component used in a [custom `_document.js`](/docs/advanced-features/custom-document.md):
+If you would like to add additional configuration options, you can include it within the `<Head />` component used in a [custom `_document.js`](/docs/advanced-features/custom-document.md):
 
 ```jsx
 import { Html, Head, Main, NextScript } from 'next/document'

errors/link-no-children.md

@@ -0,0 +1,35 @@
+# No children were passed to <Link>
+
+#### Why This Error Occurred
+
+In your application code `next/link` was used without passing a child:
+
+For example:
+
+```js
+import Link from 'next/link'
+
+export default function Home() {
+  return (
+    <Link href="/about"></Link>
+    // or
+    <Link href='/about' />
+  )
+}
+```
+
+#### Possible Ways to Fix It
+
+Make sure one child is used when using `<Link>`:
+
+```js
+import Link from 'next/link'
+
+export default function Home() {
+  return (
+    <Link href="/about">
+      <a>To About</a>
+    </Link>
+  )
+}
+```

errors/manifest.json

@@ -514,6 +514,10 @@
           "title": "future-webpack5-moved-to-webpack5",
           "path": "/errors/future-webpack5-moved-to-webpack5.md"
         },
+        {
+          "title": "link-no-children",
+          "path": "/errors/link-no-children.md"
+        },
         {
           "title": "link-multiple-children",
           "path": "/errors/link-multiple-children.md"

examples/modularize-imports/.gitignore

@@ -0,0 +1,34 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel

examples/modularize-imports/README.md

@@ -0,0 +1,27 @@
+# Modularize Imports Example
+
+This example shows how to use the `modularizeImports` config option.
+
+## Preview
+
+Preview the example live on [StackBlitz](http://stackblitz.com/):
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/vercel/next.js/tree/canary/examples/modularize-imports)
+
+## Deploy your own
+
+Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_medium=readme&utm_campaign=next-example):
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/modularize-imports&project-name=modularize-imports&repository-name=modularize-imports)
+
+## How to use
+
+Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example:
+
+```bash
+npx create-next-app --example modularize-imports modularize-imports-app
+# or
+yarn create next-app --example modularize-imports modularize-imports-app
+```
+
+Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)).

examples/modularize-imports/components/halves/LeftHalf.js

@@ -0,0 +1,3 @@
+export default function LeftHalf() {
+  return <span>Modularize</span>
+}

examples/modularize-imports/components/halves/RightHalf.js

@@ -0,0 +1,3 @@
+export default function RightHalf() {
+  return <span>Imports</span>
+}

examples/modularize-imports/components/halves/index.js

@@ -0,0 +1,5 @@
+// import LeftHalf from './LeftHalf'
+// import RightHalf from './RightHalf'
+
+// Remove the exports here so that we can verify that `modularize-imports` is working.
+// export { LeftHalf, RightHalf };

examples/modularize-imports/next.config.js

@@ -0,0 +1,9 @@
+module.exports = {
+  experimental: {
+    modularizeImports: {
+      '../components/halves': {
+        transform: '../components/halves/{{ member }}',
+      },
+    },
+  },
+}

examples/modularize-imports/package.json

@@ -0,0 +1,13 @@
+{
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "next": "latest",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2"
+  }
+}

examples/modularize-imports/pages/index.js

@@ -0,0 +1,10 @@
+import { LeftHalf, RightHalf } from '../components/halves'
+
+const Index = () => (
+  <div>
+    <LeftHalf />
+    <RightHalf />
+  </div>
+)
+
+export default Index

examples/with-emotion-swc/pages/index.js

@@ -1,5 +1,13 @@
 import { css } from '@emotion/react'
-import { Animated, Basic, bounce, Combined, Pink } from '../shared/styles'
+import {
+  Animated,
+  Basic,
+  bounce,
+  Combined,
+  Pink,
+  BasicExtended,
+  ComponentSelectorsExtended,
+} from '../shared/styles'
 
 const Home = () => (
   <div
@@ -14,6 +22,9 @@ const Home = () => (
       With <code>:hover</code>.
     </Combined>
     <Animated animation={bounce}>Let's bounce.</Animated>
+    <ComponentSelectorsExtended>
+      <BasicExtended>Nested</BasicExtended>
+    </ComponentSelectorsExtended>
   </div>
 )
 

examples/with-emotion-swc/shared/styles.js

@@ -58,10 +58,19 @@ export const Combined = styled.div`
   }
 `
 
-export const Pink = styled.div(basicStyles, {
+export const Pink = styled(Basic)({
   color: 'hotpink',
 })
 
+export const BasicExtended = styled(Basic)``
+
+export const ComponentSelectorsExtended = styled.div`
+  ${BasicExtended} {
+    color: green;
+  }
+  box-shadow: -5px -5px 0 0 green;
+`
+
 export const Animated = styled.div`
   ${basicStyles};
   ${hoverStyles};

lerna.json

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

packages/create-next-app/package.json

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

packages/eslint-config-next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-config-next",
-  "version": "12.1.1-canary.15",
+  "version": "12.1.1-canary.17",
   "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.15",
+    "@next/eslint-plugin-next": "12.1.1-canary.17",
     "@rushstack/eslint-patch": "1.0.8",
     "@typescript-eslint/parser": "5.10.1",
     "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.15",
+  "version": "12.1.1-canary.17",
   "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.15",
+  "version": "12.1.1-canary.17",
   "main": "index.js",
   "license": "MIT",
   "repository": {