CODEWITHSUNDEEP
nuxt.jsnuxt3.jsnuxt-content
Mathijs
Mathijs

Reputation: 471

Is it possible to use ssr: true and ssr: false for different routes?

I am using nuxt3 with route rules. I was wondering if it was possible to use the following route rules:

export default defineNuxtConfig({
    components: true,
     routeRules: {
        '/**': { ssr: false},
        '/blogs/**': { ssr: true},
    },
    content: {
        experimental: {
            clientDb: true
        }
    },
    nitro: {
        prerender: {
            routes: ['/sitemap.xml', ...pageRoutes, ...contentRoutes]
        }
    },
    experimental: {
        payloadExtraction: true
    }

})

I am using nuxt/content as well. Each individual blog page is prerendered through ...contentRoutes, and the /blogs/** pages show a collection of blogs to chose and filter from. Unfortunately, the above doesn't work. Nuxt content can't be found in production.

Upvotes: 1

Views: 5321

Answers (1)

Fernando Del Cantão
Fernando Del Cantão

Reputation: 553

Yes, you can conditionally enable or disable SSR for specific routes in Nuxt 3 using routeRules. The configuration you havve shown is a valid approach. Nuxt will look at each rule and apply the closest matching one for a given route. For example:

export default defineNuxtConfig({
  components: true,
  routeRules: {
    // Enable SSR for the blog routes
    '/blogs/**': { ssr: true },
    // Disable SSR for everything else
    '/**': { ssr: false }
  },
  //  
})

Few things to keep in mind

1. Order Matters: The more specific route (/blogs/**) should appear before the broader /** rule to ensure Nuxt applies SSR where you intend. That should be why your code isn’t working.

2. Catching All Routes: The /** pattern is a catch-all. Once a route matches that pattern, no further rules are checked — s= o always put the narrow routes first.

Upvotes: 0

Related Questions