vercel/next.js / no-duplicate-head.mdx

no-duplicate-head.mdx42 lines881 B
---
title: No Duplicate Head
---

> Prevent duplicate usage of `<Head>` in `pages/_document.js`.

## Why This Error Occurred

More than a single instance of the `<Head />` component was used in a single custom document. This can cause unexpected behavior in your application.

## Possible Ways to Fix It

Only use a single `<Head />` component in your custom document in `pages/_document.js`.

```jsx filename="pages/_document.js"
import Document, { Html, Head, Main, NextScript } from 'next/document'

class MyDocument extends Document {
  static async getInitialProps(ctx) {
    //...
  }

  render() {
    return (
      <Html>
        <Head />
        <body>
          <Main />
          <NextScript />
        </body>
      </Html>
    )
  }
}

export default MyDocument
```

## Useful Links

- [Custom Document](/docs/pages/building-your-application/routing/custom-document)