How do I hook into the root Vue object during SSR?

[Trinovantes]

Background
I'm currently looking into migrating my vanilla Vue app into Nuxt. However, I'm encountering an SSR issue with the UI library my app is built on (Quasar). I'm not using their CLI because I want to use Nuxt's SSG which AFAIK isn't supported in Quasar.

My Problem
In order to render Quasar components on the server, it requires calling their ssrUpdate to add their $q object into the root Vue's constructor options (https://github.com/quasarframework/quasar/blob/dev/ui/src/ssr-update.js#L24).

I already have a vanilla Vue SSR app implementing this (https://github.com/Trinovantes/MAL-Cover-CSS/blob/master/src/web/app.ts#L48) to verify this behavior. However, I'm not sure how/where to make this function call in Nuxt.

---

Edit 1:

Ok I figured it out:

// plugins/quasar.ts

import Vue from 'vue'
import Quasar from 'quasar'
import { Context } from '@nuxt/types'

Vue.use(Quasar, {
    config: {
        screen: {
            bodyClasses: true,
        },
    },
})

export default (context: Context): void => {
    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
    Quasar.ssrUpdate({
        app: context.app,
        ssr: context.ssrContext,
    })
}

// nuxt.config.ts

    plugins: [
        '~/plugins/quasar',
    ],

---

Edit 2: Since SSG doesn't have a request/response object, Quasar breaks so I needed this final change to finally compile my app

     Quasar.ssrUpdate({
         app: context.app,
-        ssr: context.ssrContext,
+        ssr: process.client ? null : {
+            req: context.ssrContext?.req ?? { headers: {} },
+            res: context.ssrContext?.res ?? {},
+        },
     })