nuxt: Generate and dynamic route fallback if static file is not generated

Hi @simplenotezy

To be able to work with the SPA fallback, I recommend to use a client plugin exporting an async function:

plugins/init.client.js

export default async function ({ store }) {
   // check if spa fallback, by checking if a value in store is empty for example
   if (!store.state.filled) {
     await store.dispatch('nuxtServerInit', context)
   }
}

Keep in mind that context does not have req & res.

The issue I am facing is dynamic routes are behaving as SPA means the head meta data are not getting updated instead the index page meta are showing up in view source of a dynamic page. Is this a intended behaviour?

Yes, this is the intended behavior. ☺️

A “hybrid mode” to serve static sites but also having a server running dynamic SSR for others might be possible as well but is not a feature that is present (yet?).

Hello, I’m using the fallback:true option and a simple 404.vue. I am using firebase hosting. It works, it shows contents of the 404.vue page but I get this error on the js console: Uncaught (in promise) DOMException: Failed to execute 'appendChild' on 'Node': This node type does not support this method. at Object.appendChild. I should not have this error right?

Sure thing @m-haziq

The issue I am facing is dynamic routes are behaving as SPA means the head meta data are not getting updated instead the index page meta are showing up in view source of a dynamic page. Is this a intended behaviour?

Yes, this is the intended behavior. ☺️

A “hybrid mode” to serve static sites but also having a server running dynamic SSR for others might be possible as well but is not a feature that is present (yet?).

Hi guys, is there already any way to run app in hybrid static + ssr mode?

I have same situation as @avanishp2 - i have SSR app and i want only some of the routes to run in static mode. But when i configure app as static and set routes in generate/routes, the rest is behaving as SPA.

Hi @Atinux - thanks for your reply. This was the code I ended up using:

export default async function ({ store, app }) {
	// check if spa fallback, by checking if a value in store is empty for example
	if (!store.state.filled) {
		await app.store.dispatch('nuxtServerInit', app.context);
	}
}

I have tested a bit, by changing mode to spa and then refreshing a page, and so far, it seems to be working. I will keep on testing, after I have run generate and see how it goes.

Thanks a lot for your help so far.

Hey @manniL I am trying to create static website with dynamic routes using nuxt generate. So here what I am doing, I have some routes in excluded section of generate which is dynamic in nature and fallback: true. This generate dist folder with 404.html, other static html and _nuxt folder with js.

The issue I am facing is dynamic routes are behaving as SPA means the head meta data are not getting updated instead the index page meta are showing up in view source of a dynamic page. Is this a intended behaviour?

My website runs on SSR mode and so everything is working fine. I am trying to get benefit of static html for some pages to load faster and keeping dynamic page as it is… what I am missing here? What approach should I take? For me SEO is important. It’s a ecommerce website.