Merge branch 'canary' into fix/gip-aspath

.vscode/launch.json

@@ -42,6 +42,16 @@
       "port": 9229,
       "skipFiles": ["<node_internals>/**"],
       "outFiles": ["${workspaceFolder}/packages/next/dist/**/*"]
+    },
+    {
+      "name": "Launch this example",
+      "type": "node",
+      "request": "launch",
+      "cwd": "${workspaceFolder}",
+      "runtimeExecutable": "yarn",
+      "runtimeArgs": ["run", "debug", "dev", "${fileDirname}"],
+      "skipFiles": ["<node_internals>/**"],
+      "port": 9229
     }
   ]
 }

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

@@ -224,3 +224,7 @@ module.exports = {
   },
 }
 ```
+
+### Cache-Control
+
+Cache-Control headers set in next.config.js will be overwritten in production to ensure that static assets can be cached effectively. If you need to revalidate the cache of a page that has been [statically generated](https://nextjs.org/docs/basic-features/pages#static-generation-recommended), you can do so by setting `revalidate` in the page's [`getStaticProps`](https://nextjs.org/docs/basic-features/data-fetching#getstaticprops-static-generation) function.

docs/api-reference/next/router.md

@@ -402,3 +402,26 @@ function Page({ router }) {
 
 export default withRouter(Page)
 ```
+
+### Typescript
+
+To use class components with `withRouter`, the component needs to accept a router prop:
+
+```tsx
+import React from 'react'
+import { withRouter, NextRouter } from 'next/router'
+
+interface WithRouterProps {
+  router: NextRouter
+}
+
+interface MyComponentProps extends WithRouterProps {}
+
+class MyComponent extends React.Component<MyComponentProps> {
+  render() {
+    return <p>{this.props.router.pathname}</p>
+  }
+}
+
+export default withRouter(MyComponent)
+```

docs/basic-features/data-fetching.md

@@ -289,7 +289,7 @@ Since Next.js compiles your code into a separate directory you can't use `__dirn
 Instead you can use `process.cwd()` which gives you the directory where Next.js is being executed.
 
 ```jsx
-import fs from 'fs'
+import { promises as fs } from 'fs'
 import path from 'path'
 
 // posts will be populated at build time by getStaticProps()
@@ -311,11 +311,11 @@ function Blog({ posts }) {
 // direct database queries. See the "Technical details" section.
 export async function getStaticProps() {
   const postsDirectory = path.join(process.cwd(), 'posts')
-  const filenames = fs.readdirSync(postsDirectory)
+  const filenames = await fs.readdir(postsDirectory)
 
-  const posts = filenames.map((filename) => {
+  const posts = filenames.map(async (filename) => {
     const filePath = path.join(postsDirectory, filename)
-    const fileContents = fs.readFileSync(filePath, 'utf8')
+    const fileContents = await fs.readFile(filePath, 'utf8')
 
     // Generally you would parse/transform the contents
     // For example you can transform markdown to HTML here
@@ -329,7 +329,7 @@ export async function getStaticProps() {
   // will receive `posts` as a prop at build time
   return {
     props: {
-      posts,
+      posts: await Promise.all(posts),
     },
   }
 }

examples/amp-story/README.md

@@ -13,9 +13,9 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu
 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 amp-story amp-app
+npx create-next-app --example amp-story amp-story-app
 # or
-yarn create next-app --example amp-story amp-app
+yarn create next-app --example amp-story amp-story-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/auth0/README.md

@@ -16,9 +16,9 @@ Read more: [https://auth0.com/blog/ultimate-guide-nextjs-authentication-auth0/](
 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 auth0 auth0
+npx create-next-app --example auth0 auth0-app
 # or
-yarn create next-app --example auth0 auth0
+yarn create next-app --example auth0 auth0-app
 ```
 
 ## Configuring Auth0

examples/cms-sanity/schemas/schema.js

@@ -71,6 +71,9 @@ export default createSchema({
           name: 'slug',
           title: 'Slug',
           type: 'slug',
+          options: {
+            source: 'title',
+          },
         },
       ],
     },

examples/fast-refresh-demo/README.md

@@ -15,9 +15,9 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu
 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 fast-refresh-demo fast-refresh-demo
+npx create-next-app --example fast-refresh-demo fast-refresh-demo-app
 # or
-yarn create next-app --example fast-refresh-demo fast-refresh-demo
+yarn create next-app --example fast-refresh-demo fast-refresh-demo-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/with-draft-js/README.md

@@ -15,7 +15,7 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu
 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 with-draft-js
+npx create-next-app --example with-draft-js with-draft-js-app
 # or
 yarn create next-app --example with-draft-js with-draft-js-app
 ```

examples/with-env-from-next-config-js/README.md

@@ -23,9 +23,9 @@ Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_mediu
 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 with-env-from-next-config-js
+npx create-next-app --example with-env-from-next-config-js with-env-from-next-config-js-app
 # or
-yarn create next-app --example with-env-from-next-config-js
+yarn create next-app --example with-env-from-next-config-js with-env-from-next-config-js-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/with-firebase-authentication/README.md

@@ -1,38 +1,3 @@
-# Example: Firebase authentication with a serverless API
+# With Firebase Authentication
 
-This example includes Firebase authentication and serverless [API routes](https://nextjs.org/docs/api-routes/introduction).
-
-## How to use
-
-Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) or [npx](https://github.com/zkat/npx#readme) to bootstrap the example:
-
-```bash
-npx create-next-app --example with-firebase-authentication with-firebase-authentication-app
-# or
-yarn create next-app --example with-firebase-authentication with-firebase-authentication-app
-```
-
-## Configuration
-
-Set up Firebase:
-
-- Create a project at the [Firebase console](https://console.firebase.google.com/).
-- Copy the contents of `.env.local.example` into a new file called `.env.local`
-- Get your account credentials from the Firebase console at _Project settings > Service accounts_, where you can click on _Generate new private key_ and download the credentials as a json file. It will contain keys such as `project_id`, `client_email` and `private_key`. Set them as environment variables in the `.env.local` file at the root of this project.
-- Get your authentication credentials from the Firebase console under _Project settings > General> Your apps_ Add a new web app if you don't already have one. Under _Firebase SDK snippet_ choose _Config_ to get the configuration as JSON. It will include keys like `apiKey` and `authDomain`. Set the appropriate environment variables in the `.env.local` file at the root of this project.
-- Go to **Develop**, click on **Realtime Database** and create a database if you don't already have one. Under _data_ get `databaseUrl`(e.g. `https://[dbname].firebaseio.com/`). Set the appropriate environment variables in the `.env.local` file at the root of this project.
-- Go to **Develop**, click on **Authentication** and in the **Sign-in method** tab enable authentication for the app.
-
-Install it and run:
-
-```bash
-npm install
-npm run dev
-# or
-yarn
-yarn dev
-```
-
-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)).
-
-After deploying, copy the deployment URL and navigate to your Firebase project's Authentication tab. Scroll down in the page to "Authorized domains" and add that URL to the list.
+Check out the [next-firebase-auth](https://github.com/gladly-team/next-firebase-auth) package and their [official example](https://github.com/gladly-team/next-firebase-auth/tree/main/example) for a powerful implementation of Firebase authentication.