Skip to content

Commit

Permalink
docs: add note about CF routes limit
Browse files Browse the repository at this point in the history
  • Loading branch information
atinux authored Oct 29, 2024
1 parent 2ca1db4 commit 6556a74
Showing 1 changed file with 32 additions and 3 deletions.
35 changes: 32 additions & 3 deletions docs/content/1.docs/3.recipes/3.pre-rendering.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export default defineNuxtConfig({
})
```

When running `nuxt build`, Nuxt will pre-render the `/` route and save the `index.html` file in the output directory.
When running `nuxt build`, Nuxt will pre-render the `/` route and save the `index.html` file in the output directory.

::callout{icon="i-ph-rocket-launch-duotone"}
When deploying with NuxtHub on Cloudflare Pages, it will serve the pre-rendered HTML file directly from the edge for maximum performance and avoid CPU usage on the server.
Expand All @@ -50,10 +50,14 @@ defineRouteRules({
This is equivalent of our example above in the `nuxt.config.ts` file.

**Notes:**

- A rule defined in `~/pages/foo/bar.vue` will be applied to `/foo/bar` requests.
- A rule in `~/pages/foo/[id].vue` will be applied to `/foo/**` requests.

::important{to="https://nuxt.com/docs/guide/going-further/experimental-features#inlinerouterules"}
::important
---
to: https://nuxt.com/docs/guide/going-further/experimental-features#inlinerouterules
---
As this is an experimental feature, you need to enable it in your `nuxt.config.ts` files with `experimental: { inlineRouteRules: true }`.
::

Expand Down Expand Up @@ -128,10 +132,35 @@ export default defineNuxtConfig({

When running `nuxt build`, Nuxt will pre-render all pages and save the `index.html` file in the `dist/` directory.

::tip{to="https://nuxt.com/docs/getting-started/prerendering" target="_blank"}
::tip{target="_blank" to="https://nuxt.com/docs/getting-started/prerendering"}
Learn more about Nuxt prerendering.
::

### Cloudflare 100 routes limit

NuxtHub will generate a [`dist/_routes.json`](https://developers.cloudflare.com/pages/functions/routing/#create-a-_routesjson-file) for Cloudflare Pages, but it has a limit of 100 excluded routes (used for static assets).

As each pre-rendered page will be added to the exclude list, we recommend to add your known pre-rendered pattern in the `nitro.cloudflare.pages.routes.exclude` option:

```ts [nuxt.config.ts]
export default defineNuxtConfig({
// ...
nitro: {
cloudflare: {
pages: {
routes: {
exclude: [
// we know that all docs and blog pages are pre-rendered
'/docs/*',
'/blog/*'
]
}
}
}
}
})
```

## Caveats

If you are using authentication in your application such as [`nuxt-auth-utils`](https://github.com/Atinux/nuxt-auth-utils), you need to remember that the authentication state will not be available during the pre-rendering process.
Expand Down

0 comments on commit 6556a74

Please sign in to comment.