3

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?

Jacob Ridgwell
  • 45
  • 6

2 Answers2

2

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.

Bulent
  • 3,307
  • 1
  • 14
  • 22
  • You can't really write any code outside of the basic scope (`#app` div). In a clean way at least. Also, I'm not sure that bringing alpine is a thing to do when you already have a JS framework. It usually used in pure HTML+CSS context only. – kissu Mar 04 '21 at 09:59
  • You can't write any Vue code outside of #app, but you can write Vanilla JS. So you can have both, and they can be very clear. Alphine is not for using among Vue, it's an alternative. If you build a page with 90% of static content, it's not logical to use any big framework. – Bulent Mar 17 '21 at 10:44
1

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.

kissu
  • 40,416
  • 14
  • 65
  • 133
  • Okay, I think I understand now. So I could have an `admin.vue` file in the pages directory of the Nuxt app, but it would be treated an a traditional SPA vs how it would treat an SSG route with it's cached assets and api calls? – Jacob Ridgwell Mar 05 '21 at 00:26