content icon indicating copy to clipboard operation
content copied to clipboard

Prerender issue when using `nuxt build`

Open djimnz opened this issue 2 years ago • 1 comments

Environment

  • Operating System: Darwin
  • Node Version: v16.17.0
  • Nuxt Version: 3.6.5
  • Nitro Version: 2.5.2
  • Package Manager: [email protected]
  • Builder: vite
  • User Config: -
  • Runtime Modules: -
  • Build Modules: -

Reproduction

No reproduction repo available, sorry

Describe the bug

Nuxt Content prerendering page force XHR request to the /api/_content/... when using nuxt build on Netlify. Navigation between content pages is slowed down due to that behavior.

I do not have issues with nuxt generate or nuxt build --prerender Nuxt Content is properly pre-rendered with the pages: in that case, navigation between pages is instant.

But in my case, I must deploy using nuxt build to have the server function deployed as well for some landing page API usages.

Also tried some configuration to force the pre-rendering of those Nuxt Content pages: /manifesto and /policies/**, but it doesn't prevent the navigation to those pages from triggering that XHR :(

I would really like to have this content fetching at built time.

IMPORTANT EDIT: When visiting one of my Nuxt Content pages on production by accessing the URL directly, that XHR is not triggered, but the content seems to appear. So, somehow, it seems that the page has been pre-rendered, but navigating between pages still triggers the content fetching even tho it doesn't need it. Example: accessing the page https://.../manifesto, show the content properly without XHR. Accessing manifesto from the homepage, will trigger that request...

Thank you!

Additional context

nuxt.config.ts

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  telemetry: false,
  spaLoadingTemplate: false,
  routeRules: {
    "/": { prerender: true, isr: true },
    "/manifesto": { prerender: true, isr: true },
    "/policies/**": { prerender: true, isr: true },
    "/api/**": { cors: true },
  },
  nitro: {
    prerender: {
      crawlLinks: true,
      routes: ["/manifesto", "/policies/terms", "/policies/privacy"],
    },
  },
 // ...
});

Network XHR sent, example

Request URL:
https://.../api/_content/query/ncypinsi6L.1692717178590.json?_params=%7B%22first%22:true,%22where%22:%5B%7B%22_path%22:%22/manifesto%22%7D%5D,%22sort%22:%5B%7B%22_file%22:1,%22$numeric%22:true%7D%5D%7D

Request Method:
GET

Manifesto Vue Template

<template>
  <div class="grid grid-cols-1 gap-32 pt-28">
    <div class="container mx-auto px-5">
      <ContentDoc />
    </div>
  </div>
</template>

Build Logs

12:42:35 AM: [info] [nitro] Initializing prerenderer
12:42:39 AM: [info] [nitro] Prerendering 5 initial routes with crawler
12:42:39 AM: [log] [nitro]   ├─ /api/_content/cache.1692718942434.json (430ms)
12:42:39 AM: [log] [nitro]   ├─ / (635ms)
12:42:39 AM: [log] [nitro]   ├─ /manifesto (675ms)
12:42:39 AM: [log] [nitro]   ├─ /policies/privacy (694ms)
12:42:39 AM: [log] [nitro]   ├─ /policies/terms (695ms)
12:42:39 AM: [log] [nitro]   ├─ /api/_content/query/ncypinsi6L.1692718942434.json (6ms)
12:42:39 AM: [log] [nitro]   ├─ /api/_content/query/KD6xtFD6Uk.1692718942434.json (7ms)
12:42:39 AM: [log] [nitro]   ├─ /api/_content/query/sp8Q7AzBGr.1692718942434.json (5ms)
12:42:39 AM: [nitro] Nitro now uses `isr` option to configure ISR behavior on Netlify. Backwards-compatible support for `static` and `swr` support with Builder Functions will be removed in the future versions. Set `future.nativeSWR: true` nitro config disable this warning.

djimnz avatar Aug 22 '23 15:08 djimnz

Hello,

An issue with _payload was in Nuxt. Could you retry now with the latest version of Nuxt?

related to https://github.com/nuxt/nuxt/issues/24067

Barbapapazes avatar Dec 13 '23 09:12 Barbapapazes