Nuxt Nation カンファレンスが開催されます。11月12日~13日にご参加ください。

defineRouteRules

ページレベルでハイブリッドレンダリングのルートルールを定義します。
この機能は実験的なもので、使用するには`nuxt.config`で`experimental.inlineRouteRules`オプションを有効にする必要があります。

使用方法

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

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

以下に変換されます

nuxt.config.ts
export default defineNuxtConfig({
  routeRules: {
    '/': { prerender: true }
  }
})
`nuxt build`を実行すると、ホームページは`.output/public/index.html`にプリレンダリングされ、静的に配信されます。

注意事項

  • `~/pages/foo/bar.vue`で定義されたルールは、`/foo/bar`リクエストに適用されます。
  • `~/pages/foo/[id].vue`のルールは、`/foo/**`リクエストに適用されます。

ページの`definePageMeta`で設定されたカスタム`path`または`alias`を使用している場合など、より詳細な制御を行うには、`nuxt.config`内で直接`routeRules`を設定する必要があります。

`routeRules`の詳細はこちらをご覧ください。