defineRouteRules

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

使用方法

app/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について詳しく読む。