https://github.com/copongcopong/vite-vuessr

We're Vite in the VueSSR! -- The Beatles
https://github.com/copongcopong/vite-vuessr

Last synced: 27 days ago
JSON representation

We're Vite in the VueSSR! -- The Beatles

• Host: GitHub
• URL: https://github.com/copongcopong/vite-vuessr
• Owner: copongcopong
• Created: 2021-08-15T14:48:27.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2023-03-07T04:00:53.000Z (almost 2 years ago)
• Last Synced: 2023-03-11T19:53:07.276Z (almost 2 years ago)
• Language: JavaScript
• Homepage:
• Size: 925 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 10
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Vite-VueSSR

 - Server Side Render (initial url load is created server-side.)

  - based on https://github.com/frandiox/vite-ssr and https://github.com/web2033/vite-vue3-tailwind-starter

 - uses vue 3 (composition api), vue-router, vueuse, vee-validate, universal-cookie, axios

 - uses **polka** for ssr nodejs server and **sirv**

 - uses Pinia for store https://pinia.esm.dev/

## Install

```

npm i 

```

## SSR mode

Run local dev (ssr version) 

```

npm run dev-ssr

```

Run local (build) ssr (prod in local)

```

npm run serve-ssr:dist

```

Build ssr version

```

npm run build-ssr

```

## SPA mode

Run local dev 

```

npm run dev

```

Build spa

```

npm run build

```

Run local preview 

```

npm run serve

```

### Files and Folders

- rename `~.env` to `.env` for vite env config

    - VITE_API_BASEURI = the api uri

- `/src/pages/app` - main app pages folder

- `/src/routes` - routing logic; see `middleware.js` on how stack handles authentication;

   - uses `meta.auth` in `routes.js` for protected pages

- `/src/stores` - pinia stores; `auth.js` handles authentication logic

## Gotchas

- call images inside `/src/assests` folder like ``

- SSR may sometimes will not work for Components designed for clientside only

    - to solve this use `...`