Pattern: Multiple Head components
Issue: -
Using multiple Head components in pages/_document.js causes undefined behavior. The Head component should only be used once to manage document head elements.
Example of incorrect code:
// pages/_document.js
export default function MyDocument() {
return (
<Html>
<Head />
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
Example of correct code:
// pages/_document.js
export default function MyDocument() {
return (
<Html>
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}