• ..

NextJS

    Head コンポーネントの中身は頭に追加される

    問題

    例えば_document.jsx<head>のデフォルトを定義して各ページでそれを上書きしようとしてもできないものがある。

    _document.jsx<head>

    <head>
      <title>foo</title>
    </head>

    pages/index.jsx<Head>

    const Head = require('next/head');
    
    <Head>
      <title>bar</title>
    <Head>

    結果

    <title>bar</title>
    <title>foo</title>

    解決

    ページ毎にすべて<Head>に書く。
    まぁ<title>は何かうまくやってくれるみたいですが、ツイッターカードとかはうまく取得できてませんでした。