defineRouteRules

Define route rules for hybrid rendering at the page level.

This feature is experimental and in order to use it you must enable the experimental.inlineRouteRules option in your nuxt.config.

Usage

pages/index.vue

<script setup lang="ts">
defineRouteRules({
  prerender: true
})
</script>

<template>
  <h1>Hello world!</h1>
</template>

Will be translated to:

nuxt.config.ts

export default defineNuxtConfig({
  routeRules: {
    '/': { prerender: true }
  }
})

When running nuxt build, the home page will be pre-rendered in .output/public/index.html and statically served.

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.

For more control, such as if you are using a custom path or alias set in the page's definePageMeta, you should set routeRules directly within your nuxt.config.