Back to Nuxt

prerenderRoutes

docs/4.api/3.utils/prerender-routes.md

4.4.41.3 KB
Original Source

When prerendering, you can hint to Nitro to prerender additional paths, even if their URLs do not show up in the HTML of the generated page.

::important prerenderRoutes can only be called within the Nuxt context. ::

::note prerenderRoutes has to be executed during prerendering. If the prerenderRoutes is used in dynamic pages/routes which are not prerendered, then it will not be executed. ::

ts
const route = useRoute()

prerenderRoutes('/')
prerenderRoutes(['/', '/about'])

::note In the browser, or if called outside prerendering, prerenderRoutes will have no effect. ::

You can even prerender API routes which is particularly useful for full statically generated sites (SSG) because you can then $fetch data as if you have an available server!

ts
prerenderRoutes('/api/content/article/name-of-article')

// Somewhere later in App
const articleContent = await $fetch('/api/content/article/name-of-article', {
  responseType: 'json',
})

::warning Prerendered API routes in production may not return the expected response headers, depending on the provider you deploy to. For example, a JSON response might be served with an application/octet-stream content type. Always manually set responseType when fetching prerendered API routes. ::