Skip to content

Commit

Permalink
Merge branch 'canary' into add/export-path-trace
Browse files Browse the repository at this point in the history
  • Loading branch information
@kodiakhq
kodiakhq[bot] committed Aug 24, 2022
2 parents 473d6e8 + 34e10f3 commit 6adadc9
Show file tree
Hide file tree
Showing 110 changed files with 2,009 additions and 934 deletions.
8 changes: 7 additions & 1 deletion docs/basic-features/font-optimization.md
View file
Expand Up @@ -53,7 +53,13 @@ class MyDocument extends Document {
export default MyDocument
```
Note that we don't recommend adding fonts with `next/head`, as this only applies the font to the particular page and won't work with a streaming architecture.
Although it's possible to add fonts in a page with [`next/head`](/docs/api-reference/next/head) it comes with some drawbacks:
- It only applies the font to that particular page.
- The font optimization will only work on page load, not on client side navigation.
- It won't work with a streaming architecture.
Thus it's highly recommended to add the font in a [Custom `Document`](/docs/advanced-features/custom-document.md), like in the code snippet above.
Automatic Webfont Optimization currently supports Google Fonts and Typekit with support for other font providers coming soon. We're also planning to add control over [loading strategies](https://github.com/vercel/next.js/issues/21555) and `font-display` values.
Expand Down
47 changes: 16 additions & 31 deletions examples/auth-with-stytch/pages/_document.tsx
View file
@@ -1,33 +1,18 @@
import Document, {
Html,
Head,
Main,
NextScript,
DocumentContext,
} from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

class MyDocument extends Document {
static async getInitialProps(ctx: DocumentContext) {
const initialProps = await Document.getInitialProps(ctx)
return { ...initialProps }
}

render() {
return (
<Html>
<Head>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html>
<Head>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap"
/>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}

export default MyDocument
24 changes: 11 additions & 13 deletions examples/blog-starter/pages/_document.tsx
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
70 changes: 27 additions & 43 deletions examples/blog/pages/_document.tsx
View file
@@ -1,47 +1,31 @@
import Document, {
Html,
Head,
Main,
NextScript,
DocumentContext,
} from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

class MyDocument extends Document {
static async getInitialProps(ctx: DocumentContext) {
const initialProps = await Document.getInitialProps(ctx)
return { ...initialProps }
export default function Document() {
const meta = {
title: 'Next.js Blog Starter Kit',
description: 'Clone and deploy your own Next.js portfolio in minutes.',
image: 'https://assets.vercel.com/image/upload/q_auto/front/vercel/dps.png',
}

render() {
const meta = {
title: 'Next.js Blog Starter Kit',
description: 'Clone and deploy your own Next.js portfolio in minutes.',
image:
'https://assets.vercel.com/image/upload/q_auto/front/vercel/dps.png',
}

return (
<Html lang="en">
<Head>
<meta name="robots" content="follow, index" />
<meta name="description" content={meta.description} />
<meta property="og:site_name" content={meta.title} />
<meta property="og:description" content={meta.description} />
<meta property="og:title" content={meta.title} />
<meta property="og:image" content={meta.image} />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@yourname" />
<meta name="twitter:title" content={meta.title} />
<meta name="twitter:description" content={meta.description} />
<meta name="twitter:image" content={meta.image} />
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
return (
<Html lang="en">
<Head>
<meta name="robots" content="follow, index" />
<meta name="description" content={meta.description} />
<meta property="og:site_name" content={meta.title} />
<meta property="og:description" content={meta.description} />
<meta property="og:title" content={meta.title} />
<meta property="og:image" content={meta.image} />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@yourname" />
<meta name="twitter:title" content={meta.title} />
<meta name="twitter:description" content={meta.description} />
<meta name="twitter:image" content={meta.image} />
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}

export default MyDocument
24 changes: 11 additions & 13 deletions examples/cms-contentful/pages/_document.js
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
24 changes: 11 additions & 13 deletions examples/cms-cosmic/pages/_document.js
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
24 changes: 11 additions & 13 deletions examples/cms-datocms/pages/_document.js
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
24 changes: 11 additions & 13 deletions examples/cms-drupal/pages/_document.js
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
24 changes: 11 additions & 13 deletions examples/cms-ghost/pages/_document.js
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
24 changes: 11 additions & 13 deletions examples/cms-graphcms/pages/_document.js
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
24 changes: 11 additions & 13 deletions examples/cms-kontent/pages/_document.js
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
24 changes: 11 additions & 13 deletions examples/cms-prepr/pages/_document.js
View file
@@ -1,15 +1,13 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
import { Html, Head, Main, NextScript } from 'next/document'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}

0 comments on commit 6adadc9

Please sign in to comment.