vitrify 0.19.1 → 0.21.0

package/dist/app-urls.js

@@ -17,7 +17,7 @@ export const getPkgJsonDir = (dir) => {
     }
     return getPkgJsonDir(new URL('..', dir));
 };
-export const getAppDir = () => getPkgJsonDir(new URL(`file://${process.cwd()}/`));
+export const getAppDir = (dir) => getPkgJsonDir(dir ?? new URL(`file://${process.cwd()}/`));
 export const getCliDir = () => getPkgJsonDir(new URL('./', import.meta.url));
 export const getCliViteDir = (cliDir) => new URL('src/vite/', cliDir);
 export const getSrcDir = (appDir) => new URL('src/', appDir);

package/dist/bin/cli.js

@@ -5,6 +5,7 @@ import { getAppDir, parsePath } from '../app-urls.js';
 import { printHttpServerUrls, exitLogs } from '../helpers/logger.js';
 import { build as esbuild } from 'esbuild';
 import { readdir } from 'fs/promises';
+import { loadSSRAssets } from '../frameworks/vue/fastify-ssr-plugin.js';
 const cli = cac('vitrify');
 cli
     .command('build')
@@ -73,12 +74,18 @@ cli
                 ...args,
                 outDir: fileURLToPath(new URL('ssr/server/', baseOutDir))
             });
-            ({ prerender, onRendered } = await import(new URL('ssr/server/prerender.mjs', baseOutDir).pathname));
+            ({ prerender } = await import(new URL('ssr/server/prerender.mjs', baseOutDir).pathname));
+            const { template, manifest, render, getRoutes, onRendered } = await loadSSRAssets({
+                mode: 'ssg',
+                distDir: baseOutDir
+            });
+            const routes = await getRoutes();
             prerender({
                 outDir: fileURLToPath(new URL('static/', baseOutDir)),
-                templatePath: fileURLToPath(new URL('static/index.html', baseOutDir)),
-                manifestPath: fileURLToPath(new URL('static/.vite/ssr-manifest.json', baseOutDir)),
-                entryServerPath: new URL('ssr/server/entry-server.mjs', baseOutDir),
+                template,
+                manifest,
+                render,
+                routes,
                 onRendered
             });
             break;

package/dist/frameworks/vue/fastify-ssr-plugin.js

@@ -2,6 +2,7 @@ import fastifyStatic from '@fastify/static';
 import { readFileSync } from 'fs';
 import { fileURLToPath } from 'url';
 import { addOrReplaceAppDiv, appendToBody, appendToHead } from '../../helpers/utils.js';
+import { getAppDir } from '../../app-urls.js';
 const fastifySsrPlugin = async (fastify, options) => {
     options.baseUrl = options.baseUrl || '/';
     options.mode = options.mode || process.env.MODE || import.meta.env.MODE;
@@ -32,11 +33,6 @@ const fastifySsrPlugin = async (fastify, options) => {
             try {
                 const url = req.raw.url?.replace(options.baseUrl, '/');
                 const provide = options.provide ? await options.provide(req, res) : {};
-                const ssrContext = {
-                    req,
-                    res,
-                    provide
-                };
                 let template = readFileSync(new URL('index.html', frameworkDir)).toString();
                 template = await vite.transformIndexHtml(url, template);
                 const entryUrl = fileURLToPath(new URL('ssr/entry-server.ts', frameworkDir));
@@ -49,39 +45,16 @@ const fastifySsrPlugin = async (fastify, options) => {
                 catch (e) {
                     manifest = {};
                 }
-                // const cssModules = [entryUrl]
-                // const matchedModules = componentsModules(cssModules, vite!)
-                // const css = collectCss({
-                //   mods: matchedModules
-                // })
-                const [appHtml, preloadLinks] = await render(url, manifest, ssrContext);
-                if (!ssrContext.initialState)
-                    ssrContext.initialState = {};
-                ssrContext.initialState.provide = provide;
-                const initialStateScript = `
-        <script>
-        __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
-        </script>`;
-                const renderHtml = (html) => {
-                    return appendToHead(preloadLinks, appendToBody(initialStateScript, addOrReplaceAppDiv(appHtml, html)));
-                };
-                let html = renderHtml(template);
-                // let html = template
-                //   .replace(`<!--app-html-->`, appHtml)
-                //   .replace('<!--product-name-->', options.productName || 'Product name')
-                //   // .replace('<!--dev-ssr-css-->', css)
-                //   .replace(
-                //     '<!--initial-state-->',
-                //     `<script>
-                //     __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
-                //     </script>`
-                //   )
-                // html = appendToHead(preloadLinks, html)
-                if (options.onRendered?.length) {
-                    for (const ssrFunction of options.onRendered) {
-                        html = ssrFunction(html, ssrContext);
-                    }
-                }
+                const html = await renderHtml({
+                    request: req,
+                    reply: res,
+                    url: url ?? '/',
+                    provide,
+                    onRendered: options.onRendered,
+                    template,
+                    manifest,
+                    render
+                });
                 res.code(200);
                 res.type('text/html');
                 res.send(html);
@@ -108,42 +81,90 @@ const fastifySsrPlugin = async (fastify, options) => {
         fastify.get(`${options.baseUrl}*`, async (req, res) => {
             const url = req.raw.url?.replace(options.baseUrl, '/');
             const provide = options.provide ? await options.provide(req, res) : {};
-            const ssrContext = {
-                req,
-                res,
-                provide
-            };
-            const template = readFileSync(fileURLToPath(new URL('./dist/ssr/client/index.html', options.appDir))).toString();
-            const manifest = JSON.parse(readFileSync(new URL('./dist/ssr/client/.vite/ssr-manifest.json', options.appDir)).toString());
-            const render = (await import(fileURLToPath(new URL('./dist/ssr/server/entry-server.mjs', options.appDir)))).render;
-            const [appHtml, preloadLinks] = await render(url, manifest, ssrContext);
-            if (!ssrContext.initialState)
-                ssrContext.initialState = {};
-            ssrContext.initialState.provide = provide;
-            const initialStateScript = `
-      <script>
-      __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
-      </script>`;
-            const renderHtml = (html) => {
-                return appendToHead(preloadLinks, appendToBody(initialStateScript, addOrReplaceAppDiv(appHtml, html)));
-            };
-            let html = renderHtml(template);
-            // let html = template.replace(`<!--app-html-->`, appHtml).replace(
-            //   '<!--initial-state-->',
-            //   `<script>
-            //     __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
-            //     </script>`
-            // )
-            // html = appendToHead(preloadLinks, html)
-            if (options.onRendered?.length) {
-                for (const ssrFunction of options.onRendered) {
-                    html = ssrFunction(html, ssrContext);
-                }
-            }
+            const { template, manifest, render, onRendered } = await loadSSRAssets({
+                distDir: new URL('./dist/', options.appDir)
+            });
+            const html = await renderHtml({
+                request: req,
+                reply: res,
+                url: url ?? '/',
+                provide,
+                onRendered,
+                template,
+                manifest,
+                render
+            });
             res.code(200);
             res.type('text/html');
             res.send(html);
         });
     }
 };
-export { fastifySsrPlugin };
+const renderTemplate = ({ template, initialStateScript, appHtml, preloadLinks }) => {
+    return appendToHead(preloadLinks, appendToBody(initialStateScript, addOrReplaceAppDiv(appHtml, template)));
+};
+const renderHtml = async (options) => {
+    const ssrContext = {
+        req: options.request,
+        res: options.reply,
+        provide: options.provide
+    };
+    const onRendered = options.onRendered ?? [];
+    const [appHtml, preloadLinks] = await options.render(options.url, options.manifest, ssrContext);
+    if (!ssrContext.initialState)
+        ssrContext.initialState = {};
+    ssrContext.initialState.provide = options.provide;
+    const initialStateScript = `
+  <script>
+  __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
+  </script>`;
+    let html = renderTemplate({
+        template: options.template,
+        appHtml,
+        initialStateScript,
+        preloadLinks
+    });
+    if (onRendered?.length) {
+        for (const ssrFunction of onRendered) {
+            html = ssrFunction(html, ssrContext);
+        }
+    }
+    return html;
+};
+const loadSSRAssets = async ({ mode, distDir } = {
+    mode: 'ssr'
+}) => {
+    const appDir = getAppDir(new URL(import.meta.url));
+    const baseOutDir = distDir || new URL('dist/', appDir);
+    let templatePath, manifestPath, entryServerPath;
+    const onRenderedPath = fileURLToPath(new URL('ssr/server/virtual_vitrify-hooks.mjs', baseOutDir));
+    if (mode === 'ssg') {
+        templatePath = fileURLToPath(new URL('static/index.html', baseOutDir));
+        manifestPath = fileURLToPath(new URL('static/.vite/ssr-manifest.json', baseOutDir));
+        entryServerPath = fileURLToPath(new URL('ssr/server/entry-server.mjs', baseOutDir));
+    }
+    else {
+        templatePath = fileURLToPath(new URL('ssr/client/index.html', baseOutDir));
+        manifestPath = fileURLToPath(new URL('ssr/client/.vite/ssr-manifest.json', baseOutDir));
+        entryServerPath = fileURLToPath(new URL('ssr/server/entry-server.mjs', baseOutDir));
+    }
+    try {
+        const template = readFileSync(templatePath).toString();
+        const manifest = JSON.parse(readFileSync(manifestPath).toString());
+        const entryServer = await import(entryServerPath);
+        const { render, getRoutes } = entryServer;
+        const onRendered = (await import(onRenderedPath)).onRendered;
+        return {
+            template,
+            manifest,
+            render,
+            getRoutes,
+            onRendered
+        };
+    }
+    catch (e) {
+        console.error(e);
+        throw new Error('Unable to load SSR asset files');
+    }
+};
+export { fastifySsrPlugin, renderHtml, loadSSRAssets };

package/dist/frameworks/vue/prerender.js

@@ -1,12 +1,8 @@
 import { existsSync, promises as fs, mkdirSync } from 'fs';
 import { routesToPaths } from '../../helpers/routes.js';
-import { appendToHead, addOrReplaceAppDiv } from '../../helpers/utils.js';
-export const prerender = async ({ outDir, templatePath, manifestPath, entryServerPath, onRendered }) => {
+import { renderHtml } from './fastify-ssr-plugin.js';
+export const prerender = async ({ outDir, template, manifest, render, routes, onRendered }) => {
     const promises = [];
-    const template = (await fs.readFile(templatePath)).toString();
-    const manifest = JSON.parse((await fs.readFile(manifestPath)).toString());
-    const { render, getRoutes } = await import(entryServerPath);
-    const routes = await getRoutes();
     const paths = routesToPaths(routes).filter((i) => !i.includes(':') && !i.includes('*'));
     const beasties = new (await import('beasties')).default({
         path: outDir,
@@ -22,18 +18,16 @@ export const prerender = async ({ outDir, templatePath, manifestPath, entryServe
         }
         const filename = (url.endsWith('/') ? 'index' : url.replace(/^\//g, '')) + '.html';
         console.log(`Generating ${filename}`);
-        const ssrContext = {
-            req: { headers: {}, url },
-            res: {}
-        };
-        const [appHtml, preloadLinks] = await render(url, manifest, ssrContext);
-        let html = addOrReplaceAppDiv(appHtml, template);
-        html = appendToHead(preloadLinks, html);
-        if (onRendered?.length) {
-            for (const ssrFunction of onRendered) {
-                html = ssrFunction(html, ssrContext);
-            }
-        }
+        let html = await renderHtml({
+            url,
+            manifest,
+            provide: {},
+            render,
+            request: { headers: {}, url },
+            reply: {},
+            template,
+            onRendered
+        });
         html = await beasties.process(html);
         promises.push(fs.writeFile(outDir + filename, html, 'utf-8'));
     }

package/dist/index.js

@@ -43,11 +43,12 @@ const manualChunkNames = [
 ];
 const moduleChunks = {
     vue: ['vue', '@vue', 'vue-router'],
-    quasar: ['quasar', '@quasar']
+    quasar: ['quasar'],
+    atQuasar: ['@quasar']
 };
 const manualChunksFn = (manualChunkList) => {
     return (id) => {
-        const matchedModule = Object.entries(moduleChunks).find(([chunkName, moduleNames]) => moduleNames.some((moduleName) => id.includes(moduleName + '/')));
+        const matchedModule = Object.entries(moduleChunks).find(([chunkName, moduleNames]) => moduleNames.some((moduleName) => new RegExp(`\/${moduleName}\/`).test(id)));
         if (id.includes('vitrify/src/')) {
             const name = id.split('/').at(-1)?.split('.').at(0);
             if (name && manualChunkNames.includes(name))
@@ -528,6 +529,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
             input: [
                 fileURLToPath(new URL('ssr/entry-server.ts', frameworkDir)),
                 fileURLToPath(new URL('ssr/prerender.ts', frameworkDir)),
+                fileURLToPath(new URL('ssr/fastify-ssr-plugin.ts', frameworkDir)),
                 fileURLToPath(new URL('ssr/server.ts', frameworkDir))
             ],
             external,

package/dist/types/app-urls.d.ts

@@ -1,6 +1,6 @@
 export declare const resolve: (packageName: string, base: URL, counter?: number) => URL;
 export declare const getPkgJsonDir: (dir: URL) => URL;
-export declare const getAppDir: () => URL;
+export declare const getAppDir: (dir?: URL) => URL;
 export declare const getCliDir: () => URL;
 export declare const getCliViteDir: (cliDir: URL) => URL;
 export declare const getSrcDir: (appDir: URL) => URL;

package/dist/types/frameworks/vue/fastify-ssr-plugin.d.ts

@@ -1,11 +1,12 @@
 import type { FastifyPluginAsync, FastifyRequest, FastifyReply } from 'fastify';
 import type { ViteDevServer } from 'vite';
 import type { OnRenderedHook } from '../../vitrify-config.js';
+type ProvideFn = (req: FastifyRequest, res: FastifyReply) => Promise<Record<string, unknown | {
+    value: unknown;
+}>>;
 export interface FastifySsrOptions {
     baseUrl?: string;
-    provide?: (req: FastifyRequest, res: FastifyReply) => Promise<Record<string, unknown | {
-        value: unknown;
-    }>>;
+    provide?: ProvideFn;
     vitrifyDir?: URL;
     vite?: ViteDevServer;
     onRendered?: OnRenderedHook[];
@@ -15,5 +16,28 @@ export interface FastifySsrOptions {
     host?: string;
 }
 declare const fastifySsrPlugin: FastifyPluginAsync<FastifySsrOptions>;
-export { fastifySsrPlugin };
+declare const renderHtml: (options: {
+    url: string;
+    request: FastifyRequest | {
+        headers: Record<string, unknown>;
+        url: string;
+    };
+    reply: FastifyReply | Record<string, unknown>;
+    provide: Record<string, unknown>;
+    onRendered?: OnRenderedHook[];
+    template: string;
+    manifest: Record<string, unknown>;
+    render: any;
+}) => Promise<string>;
+declare const loadSSRAssets: ({ mode, distDir }?: {
+    mode?: "ssr" | "ssg";
+    distDir?: URL;
+}) => Promise<{
+    template: string;
+    manifest: any;
+    render: any;
+    getRoutes: any;
+    onRendered: any;
+}>;
+export { fastifySsrPlugin, renderHtml, loadSSRAssets };
 export type FastifySsrPlugin = typeof fastifySsrPlugin;

package/dist/types/frameworks/vue/prerender.d.ts

@@ -1,8 +1,10 @@
 import type { OnRenderedHook } from 'src/node/vitrify-config.js';
-export declare const prerender: ({ outDir, templatePath, manifestPath, entryServerPath, onRendered }: {
+import { type RouteRecordRaw } from 'vue-router';
+export declare const prerender: ({ outDir, template, manifest, render, routes, onRendered }: {
     outDir: string;
-    templatePath: string;
-    manifestPath: string;
-    entryServerPath: string;
+    template: string;
+    manifest: Record<string, unknown>;
+    render: unknown;
+    routes: RouteRecordRaw[];
     onRendered: OnRenderedHook[];
 }) => Promise<void[]>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitrify",
-  "version": "0.19.1",
+  "version": "0.21.0",
   "license": "MIT",
   "author": "Stefan van Herwijnen",
   "description": "Vite as your Full Stack development tool",
@@ -52,7 +52,7 @@
     "@fastify/static": "^8.1.1",
     "@unocss/core": "^66.0.0",
     "@unocss/preset-uno": "^66.0.0",
-    "@unocss/preset-web-fonts": "66.1.0-beta.10",
+    "@unocss/preset-web-fonts": "66.1.0-beta.13",
     "@unocss/preset-wind": "^66.0.0",
     "@vitejs/plugin-vue": "^5.2.3",
     "ajv": "^8.17.1",
@@ -60,23 +60,23 @@
     "cac": "^6.7.14",
     "chalk": "^5.4.1",
     "cross-env": "^7.0.3",
-    "esbuild": "^0.25.2",
-    "fastify": "^5.2.2",
-    "glob": "^11.0.1",
-    "happy-dom": "^17.4.4",
+    "esbuild": "^0.25.3",
+    "fastify": "^5.3.2",
+    "glob": "^11.0.2",
+    "happy-dom": "^17.4.6",
     "is-port-reachable": "^4.0.0",
     "magic-string": "^0.30.17",
     "merge-deep": "^3.0.3",
     "readline": "^1.3.0",
     "rollup-plugin-visualizer": "^5.14.0",
-    "sass": "1.86.3",
+    "sass": "1.87.0",
     "ts-node": "^10.9.2",
     "unocss": "^66.0.0",
-    "unplugin-vue-components": "^28.4.1",
-    "vite": "^6.2.5",
+    "unplugin-vue-components": "^28.5.0",
+    "vite": "^6.3.4",
     "vite-plugin-pwa": "^1.0.0",
     "vitefu": "^1.0.6",
-    "vitest": "^3.1.1",
+    "vitest": "^3.1.2",
     "workbox-window": "^7.3.0"
   },
   "devDependencies": {
@@ -87,25 +87,25 @@
     "@types/connect": "^3.4.38",
     "@types/glob": "^8.1.0",
     "@types/merge-deep": "^3.0.3",
-    "@types/node": "^22.14.0",
+    "@types/node": "^22.15.3",
     "@types/ws": "^8.18.1",
     "@unocss/preset-icons": "^66.0.0",
     "@vue/runtime-core": "^3.5.13",
-    "beasties": "^0.3.1",
+    "beasties": "^0.3.3",
     "css": "^3.0.0",
     "css-to-tailwind-translator": "^1.2.8",
     "quasar": "^2.18.1",
-    "rollup": "^4.39.0",
+    "rollup": "^4.40.1",
     "typescript": "^5.8.3",
     "vue": "^3.5.13",
-    "vue-router": "^4.5.0"
+    "vue-router": "^4.5.1"
   },
   "peerDependencies": {
-    "@fastify/static": "^8.1.0",
-    "fastify": "^5.2.1",
-    "quasar": "^2.17.7",
+    "@fastify/static": "^8.1.1",
+    "fastify": "^5.3.2",
+    "quasar": "^2.18.1",
     "vue": "^3.5.13",
-    "vue-router": "^4.5.0"
+    "vue-router": "^4.5.1"
   },
   "publishConfig": {
     "access": "public",

package/src/node/app-urls.ts

@@ -19,8 +19,8 @@ export const getPkgJsonDir = (dir: URL): URL => {
   }
   return getPkgJsonDir(new URL('..', dir))
 }
-export const getAppDir = () =>
-  getPkgJsonDir(new URL(`file://${process.cwd()}/`))
+export const getAppDir = (dir?: URL) =>
+  getPkgJsonDir(dir ?? new URL(`file://${process.cwd()}/`))
 export const getCliDir = () => getPkgJsonDir(new URL('./', import.meta.url))
 export const getCliViteDir = (cliDir: URL) => new URL('src/vite/', cliDir)
 export const getSrcDir = (appDir: URL) => new URL('src/', appDir)

package/src/node/bin/cli.ts

@@ -8,6 +8,7 @@ import type { ResolvedConfig, ViteDevServer } from 'vite'
 import type { Server } from 'net'
 import type { FastifyInstance } from 'fastify'
 import { readdir } from 'fs/promises'
+import { loadSSRAssets } from '../frameworks/vue/fastify-ssr-plugin.js'
 
 const cli = cac('vitrify')
 cli
@@ -85,17 +86,23 @@ cli
           ...args,
           outDir: fileURLToPath(new URL('ssr/server/', baseOutDir))
         })
-        ;({ prerender, onRendered } = await import(
+        ;({ prerender } = await import(
           new URL('ssr/server/prerender.mjs', baseOutDir).pathname
         ))
 
+        const { template, manifest, render, getRoutes, onRendered } =
+          await loadSSRAssets({
+            mode: 'ssg',
+            distDir: baseOutDir
+          })
+        const routes = await getRoutes()
+
         prerender({
           outDir: fileURLToPath(new URL('static/', baseOutDir)),
-          templatePath: fileURLToPath(new URL('static/index.html', baseOutDir)),
-          manifestPath: fileURLToPath(
-            new URL('static/.vite/ssr-manifest.json', baseOutDir)
-          ),
-          entryServerPath: new URL('ssr/server/entry-server.mjs', baseOutDir),
+          template,
+          manifest,
+          render,
+          routes,
           onRendered
         })
         break

package/src/node/frameworks/vue/fastify-ssr-plugin.ts

@@ -9,12 +9,16 @@ import {
 } from '../../helpers/utils.js'
 import type { ViteDevServer } from 'vite'
 import type { OnRenderedHook } from '../../vitrify-config.js'
+import { getAppDir } from '../../app-urls.js'
+
+type ProvideFn = (
+  req: FastifyRequest,
+  res: FastifyReply
+) => Promise<Record<string, unknown | { value: unknown }>>
+
 export interface FastifySsrOptions {
   baseUrl?: string
-  provide?: (
-    req: FastifyRequest,
-    res: FastifyReply
-  ) => Promise<Record<string, unknown | { value: unknown }>>
+  provide?: ProvideFn
   vitrifyDir?: URL
   vite?: ViteDevServer
   // frameworkDir?: URL
@@ -66,12 +70,6 @@ const fastifySsrPlugin: FastifyPluginAsync<FastifySsrOptions> = async (
         const url = req.raw.url?.replace(options.baseUrl!, '/')
         const provide = options.provide ? await options.provide(req, res) : {}
 
-        const ssrContext: Record<string, any> = {
-          req,
-          res,
-          provide
-        }
-
         let template = readFileSync(
           new URL('index.html', frameworkDir)
         ).toString()
@@ -90,47 +88,16 @@ const fastifySsrPlugin: FastifyPluginAsync<FastifySsrOptions> = async (
           manifest = {}
         }
 
-        // const cssModules = [entryUrl]
-        // const matchedModules = componentsModules(cssModules, vite!)
-        // const css = collectCss({
-        //   mods: matchedModules
-        // })
-
-        const [appHtml, preloadLinks] = await render(url, manifest, ssrContext)
-
-        if (!ssrContext.initialState) ssrContext.initialState = {}
-        ssrContext.initialState.provide = provide
-
-        const initialStateScript = `
-        <script>
-        __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
-        </script>`
-        const renderHtml = (html: string) => {
-          return appendToHead(
-            preloadLinks,
-            appendToBody(initialStateScript, addOrReplaceAppDiv(appHtml, html))
-          )
-        }
-
-        let html = renderHtml(template)
-        // let html = template
-        //   .replace(`<!--app-html-->`, appHtml)
-        //   .replace('<!--product-name-->', options.productName || 'Product name')
-        //   // .replace('<!--dev-ssr-css-->', css)
-        //   .replace(
-        //     '<!--initial-state-->',
-        //     `<script>
-        //     __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
-        //     </script>`
-        //   )
-
-        // html = appendToHead(preloadLinks, html)
-
-        if (options.onRendered?.length) {
-          for (const ssrFunction of options.onRendered) {
-            html = ssrFunction(html, ssrContext)
-          }
-        }
+        const html = await renderHtml({
+          request: req,
+          reply: res,
+          url: url ?? '/',
+          provide,
+          onRendered: options.onRendered,
+          template,
+          manifest,
+          render
+        })
 
         res.code(200)
         res.type('text/html')
@@ -156,67 +123,148 @@ const fastifySsrPlugin: FastifyPluginAsync<FastifySsrOptions> = async (
     fastify.get(`${options.baseUrl}*`, async (req, res) => {
       const url = req.raw.url?.replace(options.baseUrl!, '/')
       const provide = options.provide ? await options.provide(req, res) : {}
-      const ssrContext: Record<string, any> = {
-        req,
-        res,
-        provide
-      }
 
-      const template = readFileSync(
-        fileURLToPath(new URL('./dist/ssr/client/index.html', options.appDir))
-      ).toString()
-      const manifest = JSON.parse(
-        readFileSync(
-          new URL('./dist/ssr/client/.vite/ssr-manifest.json', options.appDir)
-        ).toString()
-      )
-      const render = (
-        await import(
-          fileURLToPath(
-            new URL('./dist/ssr/server/entry-server.mjs', options.appDir)
-          )
-        )
-      ).render
+      const { template, manifest, render, onRendered } = await loadSSRAssets({
+        distDir: new URL('./dist/', options.appDir)
+      })
+
+      const html = await renderHtml({
+        request: req,
+        reply: res,
+        url: url ?? '/',
+        provide,
+        onRendered,
+        template,
+        manifest,
+        render
+      })
 
-      const [appHtml, preloadLinks] = await render(url, manifest, ssrContext)
+      res.code(200)
+      res.type('text/html')
+      res.send(html)
+    })
+  }
+}
 
-      if (!ssrContext.initialState) ssrContext.initialState = {}
-      ssrContext.initialState.provide = provide
+const renderTemplate = ({
+  template,
+  initialStateScript,
+  appHtml,
+  preloadLinks
+}: {
+  template: string
+  initialStateScript: string
+  appHtml: string
+  preloadLinks: string
+}) => {
+  return appendToHead(
+    preloadLinks,
+    appendToBody(initialStateScript, addOrReplaceAppDiv(appHtml, template))
+  )
+}
 
-      const initialStateScript = `
-      <script>
-      __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
-      </script>`
-      const renderHtml = (html: string) => {
-        return appendToHead(
-          preloadLinks,
-          appendToBody(initialStateScript, addOrReplaceAppDiv(appHtml, html))
-        )
-      }
+const renderHtml = async (options: {
+  url: string
+  request: FastifyRequest | { headers: Record<string, unknown>; url: string }
+  reply: FastifyReply | Record<string, unknown>
+  provide: Record<string, unknown>
+  onRendered?: OnRenderedHook[]
+  template: string
+  manifest: Record<string, unknown>
+  render: any
+}) => {
+  const ssrContext: Record<string, any> = {
+    req: options.request,
+    res: options.reply,
+    provide: options.provide
+  }
 
-      let html = renderHtml(template)
+  const onRendered = options.onRendered ?? []
 
-      // let html = template.replace(`<!--app-html-->`, appHtml).replace(
-      //   '<!--initial-state-->',
-      //   `<script>
-      //     __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
-      //     </script>`
-      // )
+  const [appHtml, preloadLinks] = await options.render(
+    options.url,
+    options.manifest,
+    ssrContext
+  )
 
-      // html = appendToHead(preloadLinks, html)
+  if (!ssrContext.initialState) ssrContext.initialState = {}
+  ssrContext.initialState.provide = options.provide
 
-      if (options.onRendered?.length) {
-        for (const ssrFunction of options.onRendered) {
-          html = ssrFunction(html, ssrContext)
-        }
-      }
+  const initialStateScript = `
+  <script>
+  __INITIAL_STATE__ = '${JSON.stringify(ssrContext.initialState)}'
+  </script>`
 
-      res.code(200)
-      res.type('text/html')
-      res.send(html)
-    })
+  let html = renderTemplate({
+    template: options.template,
+    appHtml,
+    initialStateScript,
+    preloadLinks
+  })
+
+  if (onRendered?.length) {
+    for (const ssrFunction of onRendered) {
+      html = ssrFunction(html, ssrContext)
+    }
+  }
+
+  return html
+}
+
+const loadSSRAssets = async (
+  {
+    mode,
+    distDir
+  }: {
+    mode?: 'ssr' | 'ssg'
+    distDir?: URL
+  } = {
+    mode: 'ssr'
+  }
+) => {
+  const appDir = getAppDir(new URL(import.meta.url))
+  const baseOutDir = distDir || new URL('dist/', appDir)
+
+  let templatePath, manifestPath, entryServerPath
+  const onRenderedPath = fileURLToPath(
+    new URL('ssr/server/virtual_vitrify-hooks.mjs', baseOutDir)
+  )
+  if (mode === 'ssg') {
+    templatePath = fileURLToPath(new URL('static/index.html', baseOutDir))
+    manifestPath = fileURLToPath(
+      new URL('static/.vite/ssr-manifest.json', baseOutDir)
+    )
+    entryServerPath = fileURLToPath(
+      new URL('ssr/server/entry-server.mjs', baseOutDir)
+    )
+  } else {
+    templatePath = fileURLToPath(new URL('ssr/client/index.html', baseOutDir))
+    manifestPath = fileURLToPath(
+      new URL('ssr/client/.vite/ssr-manifest.json', baseOutDir)
+    )
+    entryServerPath = fileURLToPath(
+      new URL('ssr/server/entry-server.mjs', baseOutDir)
+    )
+  }
+  try {
+    const template = readFileSync(templatePath).toString()
+    const manifest = JSON.parse(readFileSync(manifestPath).toString())
+    const entryServer = await import(entryServerPath)
+    const { render, getRoutes } = entryServer
+    const onRendered = (await import(onRenderedPath)).onRendered
+
+    return {
+      template,
+      manifest,
+      render,
+      getRoutes,
+      onRendered
+    }
+  } catch (e) {
+    console.error(e)
+    throw new Error('Unable to load SSR asset files')
   }
 }
 
-export { fastifySsrPlugin }
+export { fastifySsrPlugin, renderHtml, loadSSRAssets }
 export type FastifySsrPlugin = typeof fastifySsrPlugin

package/src/node/frameworks/vue/prerender.ts

@@ -1,26 +1,25 @@
 import { existsSync, promises as fs, mkdirSync } from 'fs'
 import type { OnRenderedHook } from 'src/node/vitrify-config.js'
 import { routesToPaths } from '../../helpers/routes.js'
-import { appendToHead, addOrReplaceAppDiv } from '../../helpers/utils.js'
+import { renderHtml } from './fastify-ssr-plugin.js'
+import { type RouteRecordRaw } from 'vue-router'
 
 export const prerender = async ({
   outDir,
-  templatePath,
-  manifestPath,
-  entryServerPath,
+  template,
+  manifest,
+  render,
+  routes,
   onRendered
 }: {
   outDir: string
-  templatePath: string
-  manifestPath: string
-  entryServerPath: string
+  template: string
+  manifest: Record<string, unknown>
+  render: unknown
+  routes: RouteRecordRaw[]
   onRendered: OnRenderedHook[]
 }) => {
   const promises = []
-  const template = (await fs.readFile(templatePath)).toString()
-  const manifest = JSON.parse((await fs.readFile(manifestPath)).toString())
-  const { render, getRoutes } = await import(entryServerPath)
-  const routes = await getRoutes()
   const paths = routesToPaths(routes).filter(
     (i) => !i.includes(':') && !i.includes('*')
   )
@@ -44,21 +43,17 @@ export const prerender = async ({
     const filename =
       (url.endsWith('/') ? 'index' : url.replace(/^\//g, '')) + '.html'
     console.log(`Generating ${filename}`)
-    const ssrContext = {
-      req: { headers: {}, url },
-      res: {}
-    }
-    const [appHtml, preloadLinks] = await render(url, manifest, ssrContext)
-
-    let html = addOrReplaceAppDiv(appHtml, template)
-    html = appendToHead(preloadLinks, html)
-
-    if (onRendered?.length) {
-      for (const ssrFunction of onRendered) {
-        html = ssrFunction(html, ssrContext)
-      }
-    }
 
+    let html = await renderHtml({
+      url,
+      manifest,
+      provide: {},
+      render,
+      request: { headers: {}, url },
+      reply: {},
+      template,
+      onRendered
+    })
     html = await beasties.process(html)
 
     promises.push(fs.writeFile(outDir + filename, html, 'utf-8'))

package/src/node/index.ts

@@ -74,13 +74,16 @@ const manualChunkNames = [
 
 const moduleChunks = {
   vue: ['vue', '@vue', 'vue-router'],
-  quasar: ['quasar', '@quasar']
+  quasar: ['quasar'],
+  atQuasar: ['@quasar']
 }
 const manualChunksFn = (manualChunkList?: string[]): ManualChunksOption => {
   return (id: string) => {
     const matchedModule = Object.entries(moduleChunks).find(
       ([chunkName, moduleNames]) =>
-        moduleNames.some((moduleName) => id.includes(moduleName + '/'))
+        moduleNames.some((moduleName) =>
+          new RegExp(`\/${moduleName}\/`).test(id)
+        )
     )
     if (id.includes('vitrify/src/')) {
       const name = id.split('/').at(-1)?.split('.').at(0)
@@ -652,6 +655,7 @@ export const baseConfig = async ({
       input: [
         fileURLToPath(new URL('ssr/entry-server.ts', frameworkDir)),
         fileURLToPath(new URL('ssr/prerender.ts', frameworkDir)),
+        fileURLToPath(new URL('ssr/fastify-ssr-plugin.ts', frameworkDir)),
         fileURLToPath(new URL('ssr/server.ts', frameworkDir))
       ],
       external,

package/src/vite/vue/csr/app.ts

@@ -3,7 +3,6 @@ import { getAppDir } from '../../../node/app-urls.js'
 // import { setup } from 'virtual:fastify-setup'
 import { onSetup } from 'virtual:vitrify-hooks'
 import { fastifyCsrPlugin } from './fastify-csr-plugin'
-import type { ViteDevServer } from 'vite'
 
 // const appDir = getPkgJsonDir(import.meta.url)
 const getString = (str?: string) => str

package/src/vite/vue/main.ts

@@ -7,12 +7,11 @@ import 'virtual:uno.css'
 
 import RootComponent from './RootComponent.vue'
 interface ssrContext {
-  ssr: boolean
   provide?: Record<string, unknown>
   [key: string]: unknown
 }
 
-function capitalizeFirstLetter(string) {
+function capitalizeFirstLetter(string: string) {
   return string.charAt(0).toUpperCase() + string.slice(1)
 }
 

package/src/vite/vue/ssr/entry-server.ts

@@ -1,11 +1,16 @@
-import { createApp } from '../main'
+import { type FastifyReply, type FastifyRequest } from 'fastify'
+import { createApp } from '../main.js'
+import { renderToString as renderToStringVue } from 'vue/server-renderer'
 
-const initializeApp = async (url, ssrContext) => {
-  const onRenderedList = []
+const initializeApp = async (
+  url: string,
+  ssrContext: Record<string, unknown>
+) => {
+  const onRenderedList: (() => unknown)[] = []
   Object.assign(ssrContext, {
     _modules: new Set(),
     _meta: {},
-    onRendered: (fn) => {
+    onRendered: (fn: () => unknown) => {
       onRenderedList.push(fn)
     }
   })
@@ -27,28 +32,43 @@ const initializeApp = async (url, ssrContext) => {
 export const getRoutes = async () =>
   (
     await initializeApp('/', {
-      ssr: false,
       req: { headers: {}, url: '/' },
       res: {}
     })
   ).routes
 
-export async function render(url, manifest, ssrContext, renderToString) {
+export async function render(
+  url: string,
+  manifest: Record<string, unknown>,
+  ssrContext: {
+    request: FastifyRequest | { headers: Record<string, unknown>; url: string }
+    reply: FastifyReply | Record<string, unknown>
+    provide: Record<string, unknown>
+  },
+  renderToString: typeof renderToStringVue
+) {
   if (!renderToString)
     renderToString = (await import('vue/server-renderer')).renderToString
   const { app, router } = await initializeApp(url, ssrContext)
 
-  const ctx = {
+  const ctx: {
+    modules?: Map<unknown, unknown>
+    transports?: Record<string, unknown>
+    __qMetaList: unknown[]
+  } = {
     __qMetaList: []
   }
   const html = await renderToString(app, ctx)
 
-  const preloadLinks = renderPreloadLinks(ctx.modules, manifest)
+  const preloadLinks = renderPreloadLinks(ctx.modules!, manifest)
 
   return [html, preloadLinks]
 }
 
-function renderPreloadLinks(modules, manifest) {
+function renderPreloadLinks(
+  modules: Map<unknown, unknown>,
+  manifest: Record<string, unknown>
+) {
   let links = ''
   const seen = new Set()
   modules.forEach((id) => {

package/src/vite/vue/ssr/fastify-ssr-plugin.ts

@@ -1,3 +1,7 @@
-import { fastifySsrPlugin } from '../../../node/frameworks/vue/fastify-ssr-plugin.js'
+import {
+  fastifySsrPlugin,
+  renderHtml,
+  loadSSRAssets
+} from '../../../node/frameworks/vue/fastify-ssr-plugin.js'
 
-export { fastifySsrPlugin }
+export { fastifySsrPlugin, renderHtml, loadSSRAssets }