Vike-Vue notes
- context
- `SSR` = spa pages where metadata injected based on space
- `SSG` = for static pages at fixed urls , /about etc (basically pre-rendering to static html in /dist )
- for ease of maintenance and additional seo, other static pages may be served from kinopio-client
- already done for space urls in netlify edge func
- making spaces directly seo friendly is less of a big deal cuz i'm not sure if google would parse the card dom structure well even if was static
- Why Vike > nuxt
- Analysing nuxt wip PR
- vs vite-ssg
- replace vite.config w nuxt.config
- What’s the relationship bw both. To upgrade vue do I need to upgrade nuxt? And vice versa?
- I think this pr requires a deeper component view re-architecting to seperate app/user logic from static pages that don't need it.
- App.vue loads for all routes , rendering `nuxt-page instead` of `router-view` https://nuxt.com/docs/api/components/nuxt-page?hidden=true
- example steps
- [x] install `vike` and `vike-vue`
- [x] vite.config ,
import vike from 'vike/plugin'
add `vike()` to plugins
- head can be set in +data
- [x] `pages/index/+Page.vue` conditionally load Vue Router (defaultFallback/SPA)
- src/pages Folder based Routing
- [x] pages/index/+Page.vue
```
<template>
<div>
<!-- Show marketing page for unauthenticated users -->
<LandingPage v-if="!isAuthenticated" />
<!-- Show SPA for authenticated users -->
<AppShell v-else />
</div>
</template>
```
- v1 goal
- DEADEND
i sorta got this to work, but hit a brick wall. vike uses node to compile files not vite, and I couldn't register a pinia plugin because they use @/ alias-ed paths, which are not supported by vike config files.
even if i use a relative path , all the deps use @/ imports so they fail
- https://github.com/vikejs/vike/issues/1567#issuecomment-3077141288?hidden=true
- Requires a vite update to support ?
Vike-Vue notes
- context
- `SSR` = spa pages where metadata injected based on space
- `SSG` = for static pages at fixed urls , /about etc (basically pre-rendering to static html in /dist )
- for ease of maintenance and additional seo, other static pages may be served from kinopio-client
- already done for space urls in netlify edge func
- making spaces directly seo friendly is less of a big deal cuz i'm not sure if google would parse the card dom structure well even if was static
- Why Vike > nuxt
- Analysing nuxt wip PR
- vs vite-ssg
- replace vite.config w nuxt.config
- What’s the relationship bw both. To upgrade vue do I need to upgrade nuxt? And vice versa?
- I think this pr requires a deeper component view re-architecting to seperate app/user logic from static pages that don't need it.
- App.vue loads for all routes , rendering `nuxt-page instead` of `router-view` https://nuxt.com/docs/api/components/nuxt-page?hidden=true
- example steps
- [x] install `vike` and `vike-vue`
- [x] vite.config ,
import vike from 'vike/plugin'
add `vike()` to plugins
- head can be set in +data
- [x] `pages/index/+Page.vue` conditionally load Vue Router (defaultFallback/SPA)
- src/pages Folder based Routing
- [x] pages/index/+Page.vue
```
<template>
<div>
<!-- Show marketing page for unauthenticated users -->
<LandingPage v-if="!isAuthenticated" />
<!-- Show SPA for authenticated users -->
<AppShell v-else />
</div>
</template>
```
- v1 goal
- DEADEND
i sorta got this to work, but hit a brick wall. vike uses node to compile files not vite, and I couldn't register a pinia plugin because they use @/ alias-ed paths, which are not supported by vike config files.
even if i use a relative path , all the deps use @/ imports so they fail
- https://github.com/vikejs/vike/issues/1567#issuecomment-3077141288?hidden=true
- Requires a vite update to support ?