Fixes #33153: Updating cross-references from master to main + canary

docs/api-reference/create-next-app.md

@@ -25,7 +25,7 @@ yarn create next-app --typescript
 `create-next-app` comes with the following options:
 
 - **--ts, --typescript** - Initialize as a TypeScript project.
-- **-e, --example [name]|[github-url]** - An example to bootstrap the app with. You can use an example name from the [Next.js repo](https://github.com/vercel/next.js/tree/master/examples) or a GitHub URL. The URL can use any branch and/or subdirectory.
+- **-e, --example [name]|[github-url]** - An example to bootstrap the app with. You can use an example name from the [Next.js repo](https://github.com/vercel/next.js/tree/main/examples) or a GitHub URL. The URL can use any branch and/or subdirectory.
 - **--example-path [path-to-example]** - In a rare case, your GitHub URL might contain a branch name with a slash (e.g. bug/fix-1) and the path to the example (e.g. foo/bar). In this case, you must specify the path to the example separately: `--example-path foo/bar`
 - **--use-npm** - Explicitly tell the CLI to bootstrap the app using npm. To bootstrap using yarn we recommend running `yarn create next-app`
 

docs/basic-features/environment-variables.md

@@ -128,11 +128,11 @@ When using the Vercel CLI to deploy make sure you add a [`.vercelignore`](https:
 
 ## Test Environment Variables
 
-Apart from `development` and `production` environments, there is a 3rd option available: `test`. In the same way you can set defaults for development or production environments, you can do the same with `.env.test` file for testing environment (though this one is not so common as the previous two).
+Apart from `development` and `production` environments, there is a 3rd option available: `test`. In the same way you can set defaults for development or production environments, you can do the same with a `.env.test` file for the `testing` environment (though this one is not as common as the previous two).
 
 This one is useful when running tests with tools like `jest` or `cypress` where you need to set specific environment vars only for testing purposes. Test default values will be loaded if `NODE_ENV` is set to `test`, though you usually don't need to do this manually as testing tools will address it for you.
 
-There is a small difference between `test` environment, and both `development` and `production` that you need to bear in mind: `.env.local` won't be loaded, as you expect tests to produce the same results for everyone. This way every test execution will use same env defaults across different executions by ignoring your `.env.local` (which is intended to override the default set).
+There is a small difference between `test` environment, and both `development` and `production` that you need to bear in mind: `.env.local` won't be loaded, as you expect tests to produce the same results for everyone. This way every test execution will use the same env defaults across different executions by ignoring your `.env.local` (which is intended to override the default set).
 
 > **Note**: similar to Default Environment Variables, `.env.test` file should be included in your repository, but `.env.test.local` shouldn't, as `.env*.local` are intended to be ignored through `.gitignore`.
 

docs/basic-features/fast-refresh.md

@@ -74,9 +74,9 @@ local state being reset on every edit to a file:
   and Hooks preserve state).
 - The file you're editing might have _other_ exports in addition to a React
   component.
-- Sometimes, a file would export the result of calling higher-order component
+- Sometimes, a file would export the result of calling a higher-order component
   like `HOC(WrappedComponent)`. If the returned component is a
-  class, state will be reset.
+  class, its state will be reset.
 - Anonymous arrow functions like `export default () => <div />;` cause Fast Refresh to not preserve local component state. For large codebases you can use our [`name-default-component` codemod](/docs/advanced-features/codemods.md#name-default-component).
 
 As more of your codebase moves to function components and Hooks, you can expect

examples/analyze-bundles/README.md

@@ -1,6 +1,6 @@
 # Analyzer Bundles example
 
-This example shows how to analyze the output bundles using [@next/bundle-analyzer](https://github.com/vercel/next.js/tree/master/packages/next-bundle-analyzer)
+This example shows how to analyze the output bundles using [@next/bundle-analyzer](https://github.com/vercel/next.js/tree/main/packages/next-bundle-analyzer)
 
 ## Preview
 

examples/gh-pages/README.md

@@ -20,7 +20,7 @@ Edit `next.config.js` and replace `'Next-gh-page-example'` by your project name.
 
 1.  Create repository.
 2.  Link it to your github account.
-3.  Publish your master branch.
+3.  Publish your default branch, e.g. `main`.
 
 ```bash
 npm run deploy

examples/progressive-web-app/pages/index.js

@@ -25,7 +25,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h3>Examples &rarr;</h3>

examples/with-apollo-and-redux/README.md

@@ -2,7 +2,7 @@
 
 This example serves as a conduit if you were using Apollo 1.X with Redux, and are migrating to Apollo 3.x, however, you have chosen not to manage your entire application state within Apollo (`apollo-link-state`).
 
-In 3.0.0, Apollo serves out-of-the-box support for redux in favor of Apollo's state management. This example aims to be an amalgamation of the [`with-apollo`](https://github.com/vercel/next.js/tree/master/examples/with-apollo) and [`with-redux`](https://github.com/vercel/next.js/tree/master/examples/with-redux) examples.
+In 3.0.0, Apollo serves out-of-the-box support for redux in favor of Apollo's state management. This example aims to be an amalgamation of the [`with-apollo`](https://github.com/vercel/next.js/tree/main/examples/with-apollo) and [`with-redux`](https://github.com/vercel/next.js/tree/main/examples/with-redux) examples.
 
 To inspect the GraphQL API, use its [web IDE](https://nextjs-graphql-with-prisma-simple-foo.vercel.app/api).
 

examples/with-cypress/pages/index.js

@@ -41,7 +41,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h2>Examples &rarr;</h2>

examples/with-docker/pages/index.js

@@ -31,7 +31,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h3>Examples &rarr;</h3>

examples/with-elasticsearch/pages/index.js

@@ -43,7 +43,7 @@ export default function Home({ isConnected }) {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h2>Examples &rarr;</h2>

examples/with-jest-babel/__tests__/__snapshots__/snapshot.tsx.snap

@@ -9,7 +9,7 @@ exports[`renders homepage unchanged 1`] = `
       <h1
         class="title"
       >
-        Welcome to 
+        Welcome to
         <a
           href="https://nextjs.org"
         >
@@ -19,7 +19,7 @@ exports[`renders homepage unchanged 1`] = `
       <p
         class="description"
       >
-        Get started by editing 
+        Get started by editing
         <code>
           pages/index.js
         </code>
@@ -51,7 +51,7 @@ exports[`renders homepage unchanged 1`] = `
         </a>
         <a
           class="card"
-          href="https://github.com/vercel/next.js/tree/master/examples"
+          href="https://github.com/vercel/next.js/tree/main/examples"
         >
           <h3>
             Examples →
@@ -82,7 +82,7 @@ exports[`renders homepage unchanged 1`] = `
         target="_blank"
       >
         Powered by
-         
+
         <span
           class="logo"
         >

examples/with-jest-babel/pages/index.tsx

@@ -32,7 +32,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h3>Examples &rarr;</h3>

examples/with-jest/__tests__/__snapshots__/snapshot.tsx.snap

@@ -9,7 +9,7 @@ exports[`renders homepage unchanged 1`] = `
       <h1
         class="title"
       >
-        Welcome to 
+        Welcome to
         <a
           href="https://nextjs.org"
         >
@@ -19,7 +19,7 @@ exports[`renders homepage unchanged 1`] = `
       <p
         class="description"
       >
-        Get started by editing 
+        Get started by editing
         <code>
           pages/index.js
         </code>
@@ -51,7 +51,7 @@ exports[`renders homepage unchanged 1`] = `
         </a>
         <a
           class="card"
-          href="https://github.com/vercel/next.js/tree/master/examples"
+          href="https://github.com/vercel/next.js/tree/main/examples"
         >
           <h3>
             Examples →
@@ -82,7 +82,7 @@ exports[`renders homepage unchanged 1`] = `
         target="_blank"
       >
         Powered by
-         
+
         <span
           class="logo"
         >

examples/with-jest/pages/index.tsx

@@ -32,7 +32,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h3>Examples &rarr;</h3>

examples/with-knex/pages/index.js

@@ -51,7 +51,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className="card"
           >
             <h3>Examples &rarr;</h3>

examples/with-mdbreact/pages/index.js

@@ -75,7 +75,7 @@ export default function Home() {
                   color="primary"
                   size="sm"
                   className="text-capitalize"
-                  href="https://github.com/vercel/next.js/tree/master/examples"
+                  href="https://github.com/vercel/next.js/tree/main/examples"
                 >
                   More →
                 </MDBBtn>

examples/with-mongodb/pages/index.js

@@ -39,7 +39,7 @@ export default function Home({ isConnected }) {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className="card"
           >
             <h3>Examples &rarr;</h3>

examples/with-playwright/pages/index.js

@@ -41,7 +41,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h2>Examples &rarr;</h2>

examples/with-rbx-bulma-pro/pages/index.js

@@ -20,7 +20,7 @@ const Home = () => (
       <Card>
         <Card.Content>
           <Content>
-            <Link href="https://github.com/vercel/next.js/tree/master/examples">
+            <Link href="https://github.com/vercel/next.js/tree/main/examples">
               <a>
                 <Title as="h3">Examples &rarr;</Title>
                 <p>

examples/with-react-bootstrap/pages/index.jsx

@@ -49,7 +49,7 @@ export default function Home() {
                 </Card.Text>
                 <Button
                   variant="primary"
-                  href="https://github.com/vercel/next.js/tree/master/examples"
+                  href="https://github.com/vercel/next.js/tree/main/examples"
                 >
                   More &rarr;
                 </Button>

examples/with-react-with-styles/README.md

@@ -6,7 +6,7 @@ In this case we are using [react-with-styles](https://github.com/airbnb/react-wi
 
 For this purpose we are extending the `<Document />` and injecting the server side rendered styles into the `<head>`.
 
-We are using `pages/_index.js` from this example [with-aphrodite](https://github.com/vercel/next.js/tree/master/examples/with-aphrodite).
+We are using `pages/_index.js` from this example [with-aphrodite](https://github.com/vercel/next.js/tree/main/examples/with-aphrodite).
 
 ## Preview
 

examples/with-reactstrap/pages/index.jsx

@@ -63,7 +63,7 @@ export default function Home() {
                   </CardText>
                   <Button
                     color="primary"
-                    href="https://github.com/vercel/next.js/tree/master/examples"
+                    href="https://github.com/vercel/next.js/tree/main/examples"
                   >
                     More &rarr;
                   </Button>

examples/with-redux-persist/README.md

@@ -30,7 +30,7 @@ Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&ut
 
 ## Notes
 
-In this example, we are going to use the Next.js example [with-redux](https://github.com/vercel/next.js/tree/master/examples/with-redux-persist) to see how you can add a layer of persistence for one of the state from global redux state. To know more about how to create a Next.js project with Redux, you can browse the example project [with-redux](https://github.com/vercel/next.js/tree/master/examples/with-redux) to know more about its implementation.
+In this example, we are going to use the Next.js example [with-redux](https://github.com/vercel/next.js/tree/main/examples/with-redux-persist) to see how you can add a layer of persistence for one of the state from global redux state. To know more about how to create a Next.js project with Redux, you can browse the example project [with-redux](https://github.com/vercel/next.js/tree/main/examples/with-redux) to know more about its implementation.
 
 The Redux Persist has been initialized in `store.js`. You can modify the `redux-persist` configuration (In this example, we are persisting only one state termed `exampleData` which is added in the `persist configuration`) if you need something more with `redux-persist` by following their [docs](https://github.com/rt2zz/redux-persist/blob/master/README.md). To wrap out our component in the `Persist Gate` which rehydrates the global state with combining the persisted values and global state values, we'll have to make some modifications in the implementation of Redux in `pages/_app.js`.
 

examples/with-redux-saga/README.md

@@ -2,7 +2,7 @@
 
 Usually splitting your app state into `pages` feels natural, but sometimes you'll want to have global state for your app. This is an example using `redux` and `redux-saga` that works with universal rendering. This is just one way it can be done. If you have any suggestions or feedback please submit an issue or PR.
 
-> This example and documentation is based on the [with-redux](https://github.com/vercel/next.js/tree/master/examples/with-redux) example.
+> This example and documentation is based on the [with-redux](https://github.com/vercel/next.js/tree/main/examples/with-redux) example.
 
 ## Preview
 

examples/with-rematch/README.md

@@ -2,7 +2,7 @@
 
 This example has two pages. The first page has a counter which can be incremented synchronously or asynchronously. The second page is a page which shows a list of github users. It fetches data from the github api using this [endpoint](api.github.com/users).
 
-Since rematch is utility which uses redux under the hood, some elements like `store.js` and `withRematch` are very similar to the `with-redux` example. Please go through the [`with-redux` example](https://github.com/vercel/next.js/tree/master/examples/with-redux) before reading further if you are not familiar with how redux is integrated with Next.js. Rematch is just an extension for Redux so a lot of elements are the same.
+Since rematch is utility which uses redux under the hood, some elements like `store.js` and `withRematch` are very similar to the `with-redux` example. Please go through the [`with-redux` example](https://github.com/vercel/next.js/tree/main/examples/with-redux) before reading further if you are not familiar with how redux is integrated with Next.js. Rematch is just an extension for Redux so a lot of elements are the same.
 
 ## Preview
 

examples/with-sitemap/pages/index.js

@@ -29,7 +29,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className="card"
           >
             <h3>Examples &rarr;</h3>

examples/with-styled-jsx-postcss/README.md

@@ -1 +1 @@
-This examples was moved to [https://github.com/vercel/next.js/tree/master/examples/with-styled-jsx-plugins](https://github.com/vercel/next.js/tree/master/examples/with-styled-jsx-plugins)
+This examples was moved to [https://github.com/vercel/next.js/tree/main/examples/with-styled-jsx-plugins](https://github.com/vercel/next.js/tree/main/examples/with-styled-jsx-plugins)

examples/with-supertokens/pages/index.js

@@ -141,7 +141,7 @@ function ProtectedPage({ userId }) {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h3>Examples &rarr;</h3>

examples/with-tailwindcss/pages/index.tsx

@@ -45,7 +45,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className="p-6 mt-6 text-left border w-96 rounded-xl hover:text-blue-600 focus:text-blue-600"
           >
             <h3 className="text-2xl font-bold">Examples &rarr;</h3>

examples/with-typestyle/README.md

@@ -2,7 +2,7 @@
 
 This example features how you use a different styling solution than [styled-jsx](https://github.com/vercel/styled-jsx) that also supports universal styles. That means we can serve the required styles for the first render within the HTML and then load the rest in the client. In this case we are using [typestyle](https://github.com/typestyle/typestyle).
 
-For this purpose we are extending the `<Document />` and injecting the server side rendered styles into the `<head>`. Refer to [with-typescript](https://github.com/vercel/next.js/tree/master/examples/with-typescript) to use this with typescript.
+For this purpose we are extending the `<Document />` and injecting the server side rendered styles into the `<head>`. Refer to [with-typescript](https://github.com/vercel/next.js/tree/main/examples/with-typescript) to use this with typescript.
 
 ## Preview
 

packages/create-next-app/README.md

@@ -23,7 +23,7 @@ npx create-next-app blog-app
 `create-next-app` comes with the following options:
 
 - **--ts, --typescript** - Initialize as a TypeScript project.
-- **-e, --example [name]|[github-url]** - An example to bootstrap the app with. You can use an example name from the [Next.js repo](https://github.com/vercel/next.js/tree/master/examples) or a GitHub URL. The URL can use any branch and/or subdirectory.
+- **-e, --example [name]|[github-url]** - An example to bootstrap the app with. You can use an example name from the [Next.js repo](https://github.com/vercel/next.js/tree/main/examples) or a GitHub URL. The URL can use any branch and/or subdirectory.
 - **--example-path <path-to-example>** - In a rare case, your GitHub URL might contain a branch name with a slash (e.g. bug/fix-1) and the path to the example (e.g. foo/bar). In this case, you must specify the path to the example separately: `--example-path foo/bar`
 - **--use-npm** - Explicitly tell the CLI to bootstrap the app using npm. To bootstrap using yarn we recommend to run `yarn create next-app`
 

packages/create-next-app/templates/default/pages/index.js

@@ -33,7 +33,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h2>Examples &rarr;</h2>

packages/create-next-app/templates/typescript/pages/index.tsx

@@ -34,7 +34,7 @@ const Home: NextPage = () => {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className={styles.card}
           >
             <h2>Examples &rarr;</h2>

test/development/basic/tailwind-jit/pages/index.js

@@ -38,7 +38,7 @@ export default function Home() {
           </a>
 
           <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
+            href="https://github.com/vercel/next.js/tree/main/examples"
             className="p-6 mt-6 text-left border w-96 rounded-xl hover:text-blue-600 focus:text-blue-600"
           >
             <h3 className="text-2xl font-bold">Examples &rarr;</h3>