Alternate page with proper canonical tag and duplicate URL part errors in Google search console report

Question

I have a static blog site created with Nuxt and hosted on Netlify. For content, I am using markdown files and the new Content module in Nuxt. I used Nuxt and static content, along with vue-meta for SEO purposes, but after a couple months, my coverage report shows multiple errors, and I can't get any pages returned in Google, even when searching on the site name or a specific string of text used on the site.

Here's my setup:

1. My markdown content is stored in /content/posts
2. In my blog/index.vue file, this is what I have for my meta tags and data fetching:

<script>
export default {
  name: 'Posts',
  head() {
    return {
      title: 'Blog Posts',
      meta: [
        {
          hid: 'description',
          name: 'description',
          content: 'Example Site blog index'
        },
        {
          hid: 'link',
          name: 'link',
          content: 'https://example.com/blog'
        }
      ]
    }
  },
  async asyncData({ $content, params }) {
    const posts = await $content('posts', params.slug)
      .only(['title', 'description', 'publishDate', 'slug'])
      .sortBy('publishDate', 'desc')
      .fetch()

    return {
      posts
    }
  },
};
</script>

3. In my /blog/_slug/index.vue page, I'm doing almost the same thing.

export default {
  name: 'Post',
  computed: {
    pageConfig() {
      return {
        identifier: this.post.slug
      }
    }
  },
  head() {
    return {
      title: this.post.title,
      meta: [
        {
          hid: 'description',
          name: 'description',
          content: this.post.description
        },
        {
          property: "og:site_name",
          hid: "og:site_name",
          vmid: "og:site_name",
          content: "My Site Name"
        },
        {
          property: "og:title",
          hid: "og-title",
          vmid: "og-title",
          content: this.post.title
        },
        {
          property: "og:description",
          hid: "og-description",
          vmid: "og-description",
          content: this.post.description
        },
        {
          property: "og:type",
          hid: "og-type",
          vmid: "og-type",
          content: "article"
        },
        {
          property: "og:url",
          hid: "og-url",
          vmid: "og-url",
          content: 'https://example.com/blog/' + this.post.slug
        },
        {
          hid: "link",
          name: "link",
          content: 'https://example.com/blog/' + this.post.slug
        },
      ],
      link: [
        {
          rel: 'canonical',
          href: 'https://example.com/blog/' + this.post.slug
        }
      ]
    }
  },
  async asyncData({ $content, params }) {
    const post = await $content('posts', params.slug).fetch()

    return  {
      post
    }
  },
}

4. I'm using this to generate my sitemap in nuxt.config.js

  sitemap: {
    path: '/sitemap.xml',
    hostname: process.env.BASE_URL,
    gzip: true,
    routes: async () => {
      let routes = []
      const { $content } = require('@nuxt/content')
      let posts = await $content('posts').fetch()
      for (const post of posts) {
        routes.push(`blog/${post.slug}`)
      }
      return routes
    },
  }

and this generates a sitemap at /sitemap.xml with the following structure

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
<url>
  <loc>https://example.com/blog/blog-post-1</loc>
</url>
<url>
  <loc>https://example.com/blog/blog-post-2</loc>
</url>
<url>
  <loc>https://example.com/blog/blog-post-3</loc>
</url>


</urlset>

5. I submitted my sitemap to Google.

When I look at my Coverage report in Google Search Console, I have two main problems:

1. A large number of posts listed under Not Found (404) with a URL of https://example.com/blog/blog/my-blog-post (two /blogs in the URL). I've noticed this happens sometimes when I click on a post right after deploying to Netlify. I've looked around the code, and I can't find where I might be adding an extra /blog in the URL.
2. An equally large number under Alternate page with proper canonical tag. Before I put the canonical tag in my /_slug/index/vue header, I got errors about missing a canonical tag, and now that I put that in, I get this error instead.

What do I need to do to fix these errors and get my content correctly indexed?