Can part of a website be static site generated and the other be a traditional spa?

Question

So, I've built a website in Nuxt and used ssg. It's great, but for another website 90% of it is all static text and images, but I want a customer login portal where they can see statuses of their products. With my understanding, I don't see how this could be ssg as well. So is it possible to have both?

Answer 1

Vue.js is rendered into #app. Everything outside of that div will be static. So yes, you can have both. BTW, if you don't need SPA completely, check for alphine.js which is a lightweight alternative.

Answer 2

generate-exclude configuration can help you avoiding to SSR specific pages.

So, let's say we have this

export default {
  generate: {
    exclude: [
      /^\/admin/ // path starts with /admin
    ]
  }
}

It will SSR render everything but the admin path, this one will only be available as an SPA generated route.

---

EDIT to answer to the comments

If you have this kind of structure, all the nested routes under admin will be rendered as SPA pages. blog and pricing would still be universal (server + client rendered).

Also, a simple admin.vue can also do the job yeah (if no more routes needed).

pages
--admin
----secure-dashboard.vue
----info.vue
--blog
--pricing

For the cache, I'm not sure exactly how it behaves but it should still be working, since it's browser side. Not really depending of the type of rendering.