Merge branch 'canary' into bugfix/fix-example-cms-contentful

Author: leerob

.github/ISSUE_TEMPLATE/1.bug_report.yml

@@ -14,6 +14,12 @@ body:
   - type: markdown
     attributes:
       value: 'next@canary is the beta version of Next.js. It includes all features and fixes that are pending to land on the stable release line.'
+  - type: textarea
+    attributes:
+      label: Run `next info` (available from version 12.0.8 and up)
+      description: Please run `next info` in the root directory of your project and paste the results. You might need to use `npx --no-install next info` if next is not in the current PATH.
+    validations:
+      required: false
   - type: input
     attributes:
       label: What version of Next.js are you using?

.github/workflows/build_test_deploy.yml

@@ -14,7 +14,8 @@ jobs:
         with:
           only-labels: 'please add a complete reproduction'
           close-issue-message: 'This issue has been automatically closed after 30 days of inactivity with no reproduction. If you are running into a similar issue, please open a new issue with a reproduction. Thank you.'
-          days-before-issue-close: 30
+          days-before-issue-close: 1
+          days-before-issue-stale: 30
           days-before-pr-close: -1
           days-before-pr-stale: -1
           exempt-issue-labels: 'blocked,must,should,keep'

.github/workflows/stale.yml

@@ -164,7 +164,7 @@ export function reportWebVitals(metric) {
 > ```js
 > export function reportWebVitals({ id, name, label, value }) {
 >   // Use `window.gtag` if you initialized Google Analytics as this example:
->   // https://github.com/vercel/next.js/blob/canary/examples/with-google-analytics/pages/_document.js
+>   // https://github.com/vercel/next.js/blob/canary/examples/with-google-analytics/pages/_app.js
 >   window.gtag('event', name, {
 >     event_category:
 >       label === 'web-vital' ? 'Web Vitals' : 'Next.js custom metric',

docs/advanced-features/measuring-performance.md

@@ -12,6 +12,8 @@ Ensure you have the `rc` npm tag of React installed:
 npm install next@latest react@rc react-dom@rc
 ```
 
+That's all! You can now start using React 18's new APIs like `startTransition` and `Suspense` in Next.js.
+
 ### Enable SSR Streaming (Alpha)
 
 Concurrent features in React 18 include built-in support for server-side Suspense and SSR streaming support, allowing you to server-render pages using HTTP streaming.

docs/advanced-features/react-18.md

@@ -21,7 +21,7 @@ Usage
   $ next <command>
 
 Available commands
-  build, start, export, dev, lint, telemetry
+  build, start, export, dev, lint, telemetry, info
 
 Options
   --version, -v   Version number
@@ -125,3 +125,36 @@ Next.js collects **completely anonymous** telemetry data about general usage.
 Participation in this anonymous program is optional, and you may opt-out if you'd not like to share any information.
 
 To learn more about Telemetry, [please read this document](https://nextjs.org/telemetry/).
+
+## Info
+
+`next info` prints relevant details about the current system which can be used to report Next.js bugs.
+This information includes Operating System platform/arch/version, Binaries (Node.js, npm, Yarn, pnpm) and npm package versions (`next`, `react`, `react-dom`).
+
+Running the following in your project's root directory:
+
+```bash
+next info
+```
+
+will give you information like this example:
+
+```bash
+
+    Operating System:
+      Platform: linux
+      Arch: x64
+      Version: #22-Ubuntu SMP Fri Nov 5 13:21:36 UTC 2021
+    Binaries:
+      Node: 16.13.0
+      npm: 8.1.0
+      Yarn: 1.22.17
+      pnpm: 6.24.2
+    Relevant packages:
+      next: 12.0.8
+      react: 17.0.2
+      react-dom: 17.0.2
+
+```
+
+This information should then be pasted into GitHub Issues.

docs/api-reference/cli.md

@@ -204,7 +204,7 @@ The default behavior of the `Link` component is to `push` a new URL into the `hi
 The default behavior of `Link` is to scroll to the top of the page. When there is a hash defined it will scroll to the specific id, like a normal `<a>` tag. To prevent scrolling to the top / hash `scroll={false}` can be added to `Link`:
 
 ```jsx
-<Link href="/?counter=10" scroll={false}>
+<Link href="/#hashid" scroll={false}>
   <a>Disables scrolling to the top</a>
 </Link>
 ```

docs/api-reference/next/link.md

@@ -90,6 +90,7 @@ Next.js provides an ESLint plugin, [`eslint-plugin-next`](https://www.npmjs.com/
 | ✔️  | [next/no-head-import-in-document](https://nextjs.org/docs/messages/no-head-import-in-document) | Disallow importing next/head in pages/document.js                                                                            |
 | ✔️  | [next/no-html-link-for-pages](https://nextjs.org/docs/messages/no-html-link-for-pages)         | Prohibit HTML anchor links to pages without a Link component                                                                 |
 | ✔️  | [next/no-img-element](https://nextjs.org/docs/messages/no-img-element)                         | Prohibit usage of HTML <img> element                                                                                   |
+| ✔️  | [next/no-head-element](https://nextjs.org/docs/messages/no-head-element)                       | Prohibit usage of HTML <head> element                                                                                  |
 | ✔️  | [next/no-page-custom-font](https://nextjs.org/docs/messages/no-page-custom-font)               | Prevent page-only custom fonts                                                                                               |
 | ✔️  | [next/no-sync-scripts](https://nextjs.org/docs/messages/no-sync-scripts)                       | Forbid synchronous scripts                                                                                                   |
 | ✔️  | [next/no-title-in-document-head](https://nextjs.org/docs/messages/no-title-in-document-head)   | Disallow using <title> with Head from next/document                                                                    |
@@ -202,11 +203,15 @@ Then, add `prettier` to your existing ESLint config:
 If you would like to use `next lint` with [lint-staged](https://github.com/okonet/lint-staged) to run the linter on staged git files, you'll have to add the following to the `.lintstagedrc.js` file in the root of your project in order to specify usage of the `--file` flag.
 
 ```js
+const path = require('path')
+
+const buildEslintCommand = (filenames) =>
+  `next lint --fix --file ${filenames
+    .map((f) => path.relative(process.cwd(), f))
+    .join(' --file ')}`
+
 module.exports = {
-  '**/*.js?(x)': (filenames) =>
-    `next lint --fix --file ${filenames
-      .map((file) => file.split(process.cwd())[1])
-      .join(' --file ')}`,
+  '*.{js,jsx,ts,tsx}': [buildEslintCommand],
 }
 ```
 

docs/basic-features/eslint.md

@@ -447,6 +447,7 @@
           "path": "/errors/link-multiple-children.md"
         },
         { "title": "no-img-element", "path": "/errors/no-img-element.md" },
+        { "title": "no-head-element", "path": "/errors/no-head-element.md" },
         {
           "title": "non-dynamic-getstaticpaths-usage",
           "path": "/errors/non-dynamic-getstaticpaths-usage.md"

errors/manifest.json

@@ -0,0 +1,30 @@
+# No Head Element
+
+### Why This Error Occurred
+
+An HTML `<head>` element was used to include page-level metadata, but this can cause unexpected behavior in a Next.js application. Use Next.js' built-in `<Head />` component instead.
+
+### Possible Ways to Fix It
+
+Import and use the `<Head />` component:
+
+```jsx
+import Head from 'next/head'
+
+function Index() {
+  return (
+    <>
+      <Head>
+        <title>My page title</title>
+        <meta name="viewport" content="initial-scale=1.0, width=device-width" />
+      </Head>
+    </>
+  )
+}
+
+export default Index
+```
+
+### Useful Links
+
+- [next/head](https://nextjs.org/docs/api-reference/next/head)