nuxt.jsのカスタムレイアウトが反映されない。ドキュメントの通りにしていてデフォルトレイアウトは反映されています。

Question

前提・実現したいこと

nuxt.jsを使っていてカスタムレイアウトを反映させたいです。
ドキュメントにある例を全て真似ても反映されませんでした。
https://nuxtjs.org/ja/docs/concepts/views/#layouts

発生している問題・エラーメッセージ

デフォルトレイアウトは反映されるがカスタムレイアウトが反映されない。
エラーなどは出ていません。

該当のソースコード

pages/post.vue

<template>
  <!-- テンプレート -->
  <div>
      こんにちは
  </div>
</template>

<script>

  export default {
    layout: 'blog'
    // ページコンポーネントの定義
  }

</script>

layouts/blog.vue

<template>
    <div>
        blog.vue
        <Nuxt />
    </div>
</template>

試したこと

原因が分からないのでpost.vueのlayoutプロパティの値をパスに変えてみたり、blog.vue側にlayoutプロパティつけてみたりしました。

補足情報（FW/ツールのバージョンなど）

tailwind css　使用
npm 使用
chorme,brave

ここにより詳細な情報を記載してください。