Prefetching none-markdown files - 404 Document not found

[Szymon-dziewonski]

Environment

• Operating System: Darwin
• Node Version: v18.16.1
• Nuxt Version: 3.7.3
• CLI Version: 3.9.0
• Nitro Version: 2.6.3
• Package Manager: [email protected]
• Builder: -
• User Config: modules, content
• Runtime Modules: @nuxt/[email protected]
• Build Modules: -

Reproduction

https://stackblitz.com/edit/github-a1ppue?file=nuxt.config.ts,components%2Fnavigation%2Fnavigation.vue,pages%2Fmodules%2F[...slug].vue,app.vue

OR

https://github.com/Szymon-dziewonski/NuxtContentPrefetch

Run project yarn then yarn dev When app is up, please navigate to http://localhost:3000/modules/subdir/welcome

There is as many errors as links used in application, that link point into non-existsing markdown file in content directory. Example: when in content/subdir/about.md file there is [Back home](/) and there is no content/index.md file, then there error occurs. When there is link in app <NuxtLink to="/" and there is no content/index.md it throws error. Those link can point into app main route pages/index.vue

Describe the bug

When link exists either in Markdown content or outside by using NuxtLink, nuxt/content wants to prefetch any route link as it would be link to markdown. However there might be a case where link in *.md could be to "normal" component route into e.g pages/index.vue file.

Even if that would not be desired action from creator perspective, then having simple <NuxtLink to="/"> in any component, when simple content/subdir/index.md file is empty causing error, is a bug that should not happen.

Additional context

From my POV this is regression introduced in 2.7.1 version in this PR in this line https://github.com/nuxt/content/commit/b88cc2f4301bda608037afd995116cd06801f021#diff-40309d1437d7357b58af3b1f07ef9e58051befdc99b8c5766589b7c500e5013aR256 , version 2.7.0 is working well.

Possible solutions:

• There should be check if link given by event link:prefetch is actually markdown file, if not do nothing.
• Whole behavior IMHO should be under flag e.g prefetchDocuments

Logs

No response

[kogratte]

Big up. I can describe the exact same issue. It makes nuxi generate fail for full static output.

[rikzwarthoff]

We're also having the same issue @2.8.5, we have some relative links that link to external applications. It tries fetch content for these. The NuxtLink's even have external: true prop.

[rikzwarthoff]

@Szymon-dziewonski can you label this ticket as a bug?

[Szymon-dziewonski]

@rikzwarthoff unfortunately I can't add label, only moderators probably can :(

[rikzwarthoff]

@Szymon-dziewonski Ah sorry wasn't aware :)

[PhE]

Big up. I can describe the exact same issue. It makes nuxi generate fail for full static output.

You can ignore errors and get a working generate output with:

export default defineNuxtConfig({
  nitro: {
    prerender: {
      // https://github.com/nuxt-themes/docus/issues/944#issuecomment-1634580369
      concurrency: 1,
      // https://github.com/nuxt-themes/docus/issues/944#issuecomment-1634798275
      failOnError: false,
    },
  },
})

[Szymon-dziewonski]

@PhE silencing error is not a solution, it never is

[jpzbkk]

The following solved my issues!

I had content:{documentDriven: true} in my nuxt.config.ts so every non-content page it was querying for content, and also drastically slowing the page down. Now things are super snappy and no errors.

https://github.com/nuxt/content/issues/1656#issuecomment-1307507172

When you enable document-driven mode, Module tries to load content that have same path as your page, and since you don't have index.md in the announcements directory, it will raise a 404 error.

You can disable document-driven per page in situations like this. put this snippet in annoucement/index.vue

definePageMeta({
  documentDriven: false
})

[PhE]

@PhE silencing error is not a solution, it never is

You're right.

But it's not silenced, errors appear on the build/generate log. When part of your content is user generated, you don't want the whole app build fail because of a user typo.

It's a workaround for a known regression of nuxt 3.6.2, not a fix. Sometimes this is your only way for build/generate.

[rikzwarthoff]

The following solved my issues!

I had content:{documentDriven: true} in my nuxt.config.ts so every non-content page it was querying for content, and also drastically slowing the page down. Now things are super snappy and no errors.

#1656 (comment)

When you enable document-driven mode, Module tries to load content that have same path as your page, and since you don't have index.md in the announcements directory, it will raise a 404 error. You can disable document-driven per page in situations like this. put this snippet in annoucement/index.vue

definePageMeta({
  documentDriven: false
})

Don't think this is a fix for this issue if you are actually using document-driven mode, it's trying to fetch on my content pages.

[rikzwarthoff]

@danielroe @farnabaz @Atinux, can you guys please take a look here

[atinux]

@rikzwarthoff I advice not to use the documentDriven mode as we have found many issues with it and will remove it in the next major version. Could you try without it please?

[jpzbkk]

@rikzwarthoff I advice not to use the documentDriven mode as we have found many issues with it and will remove it in the next major version. Could you try without it please?

Seems to actually work without that prop set. So I guess all i had to do was remove that from the config, never needed.

[xkdvSrPD]

stop use layouts, delete layouts folder. delete all <NuxtLayout>. idont know why, but it works for me

[raf202]

What finally worked for me.: Just add blank .md files in the content folder for whatever you're linking in your application.

Alternatively, using no-prefetch on links for non-content-existing pages work as well (maybe global no-prefetch solves all at once, but I haven't tested it)

[Szymon-dziewonski]

@raf202 this isnt solution at all, have you even read issue description? if I would add empty .md file e.g index.md i would never read pages/index.vue.

For rest I wrote everything from scratch using composables like queryContent or fetchContentNavigation.