Nuxt content-driven site problem: queryContent pages giving 404s during generate

17 Views Asked by At

I have a nuxt3 site at https://oberbrunner.com/, with code at https://github.com/garyo/oberbrunner-website -- it's always worked fine until today. It uses @nuxt/content with mostly markdown content-driven pages.

I tried to push a new version, which required updating a bunch of the dependencies, and now my dynamically-generated articles/tags/* pages give 404 errors during nuxt generate. It looks like it's running the queries but then looking for the query result in a different file -- not sure what's really going on.

Those pages are referred to by the static Markdown content pages, and I can see the pre-render pass loading them and I think it's trying to do the query, but then the 404s show up because the json files they're looking for were never created (it creates ones with different names -- not sure if that's relevant. Happy to paste the whole nuxt generate output in if that's helpful.)

All the code & config are in the above repo, but here's the basics:

% pnpm ls
dependencies:
h3 1.11.1
nuxt-icon 0.6.10
rehype-katex 7.0.0
remark-math 6.0.0
vue-composable 1.0.0-beta.24

devDependencies:
@heroicons/vue 2.1.3
@nuxt/content 2.12.1
@nuxt/image 1.4.0
@nuxtjs/color-mode 3.3.3
@nuxtjs/tailwindcss 6.11.4
@tailwindcss/typography 0.5.10
@types/node 18.19.26
nuxt 3.11.1
vue-gtag 2.0.1

nuxt.config.ts, relevant section:

export default defineNuxtConfig({
...
  content: {
    documentDriven: true,
    markdown: {
      anchorLinks: false,
      remarkPlugins: [
        'remark-math'
      ],
      rehypePlugins: [
        'rehype-katex'
      ]
    }
  },

Errors when running pnpm nuxt generate:

Errors prerendering:
  ├─ /api/_content/query/wyAI10pxT3.1711366156783.json (1ms)                              
  │ ├── Error: [404] Document not found!
  │ └── Linked from /articles/tags/programming
  ├─ /api/_content/query/3wG2XPSOCP.1711366156783.json (1ms)                               
  │ ├── Error: [404] Document not found!
  │ └── Linked from /articles/tags/async
  ├─ /api/_content/query/V075q5TyMx.1711366156783.json (1ms)                               
  │ ├── Error: [404] Document not found!
  │ └── Linked from /articles/tags/society & culture
  ├─ /api/_content/query/oeZgEOdCy4.1711366156783.json (2ms)                               
  │ ├── Error: [404] Document not found!

My tag page, [tag].vue:

<script setup lang="ts">
const route = useRoute()
const tag = route.params.tag

const { data: queryResult, pending, error, refresh } =
  await useAsyncData(`tag-query-${tag}`,
                     () => {
                       return queryContent('/articles')
                         .where({
                           tags: { $contains: tag }
                         })
                         .find()
  })
const articles = queryResult.value
</script>

<template>
  <NuxtLayout>
    <h1>Articles tagged with {{ tag }}</h1>
    <div class="layout flex flex-wrap gap-5">
      <ArticlesListItem v-for="(article, index) in articles" :key="index" :article="article" />
    </div>
  </NuxtLayout>
</template>
0

There are 0 best solutions below