vitrify 0.26.0 → 0.26.1

package/dist/bin/dev.js

@@ -98,7 +98,11 @@ ssr, framework = 'vue', host, appDir, publicDir, vite }) {
             ? fileURLToPath(new URL('src/vite/fastify/entry.ts', cliDir))
             : fileURLToPath(new URL(`src/vite/${framework}/ssr/app.ts`, cliDir));
         const environment = vite.environments.ssr;
-        ({ setup, onTemplateRendered, onAppRendered, vitrifyConfig } =
+        ({
+            setup,
+            hooks: { onTemplateRendered, onAppRendered },
+            vitrifyConfig
+        } =
             // @ts-expect-error missing types
             await environment.runner.import(entryUrl));
         app = fastify({

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

@@ -191,7 +191,7 @@ const loadSSRAssets = async ({ mode, distDir } = {
         const manifest = JSON.parse(readFileSync(manifestPath).toString());
         const entryServer = await import(entryServerPath);
         const { render, getRoutes } = entryServer;
-        const { onTemplateRendered, onAppRendered } = await import(vitrifyHooksPath);
+        const { hooks: { onTemplateRendered, onAppRendered } } = await import(vitrifyHooksPath);
         return {
             template,
             manifest,

package/dist/index.js

@@ -31,8 +31,8 @@ const internalServerModules = [
 const manualChunkNames = [
     'prerender',
     'fastify-ssr-plugin',
-    'fastify-csr-plugin',
-    'server'
+    'fastify-csr-plugin'
+    // 'server'
 ];
 const moduleChunks = {
     vue: [
@@ -53,28 +53,6 @@ const moduleChunks = {
     quasar: ['quasar'],
     atQuasar: ['@quasar']
 };
-const manualChunksFn = (manualChunkList) => {
-    return (id) => {
-        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))
-                return name;
-        }
-        else if (VIRTUAL_MODULES.some((virtualModule) => id.includes(virtualModule))) {
-            return VIRTUAL_MODULES.find((name) => id.includes(name));
-        }
-        else if (manualChunkList?.some((file) => id.includes(file))) {
-            return manualChunkList.find((file) => id.includes(file));
-        }
-        else if (id.includes('node_modules')) {
-            if (matchedModule) {
-                return matchedModule[0];
-            }
-            return 'vendor';
-        }
-    };
-};
 export const VIRTUAL_MODULES = [
     'virtual:vitrify-hooks',
     'virtual:static-imports',
@@ -82,6 +60,41 @@ export const VIRTUAL_MODULES = [
     'vitrify.sass',
     'vitrify.css'
 ];
+/**
+ * Advanced chunking may no longer be necessary.
+ * @param ssr
+ * @returns
+ */
+const createCodeSplittingGroups = (ssr) => {
+    return [
+        ...VIRTUAL_MODULES.map((m) => ({
+            name: m,
+            test: new RegExp(m),
+            priority: 30
+        }))
+        // ...manualChunkNames.map((m) => ({
+        //     name: m,
+        //     test: new RegExp(m),
+        //     priority: 20
+        //   })),
+        //   ...Object.entries(moduleChunks).map(([key, value]) => ({
+        //     name: key,
+        //     test: new RegExp(value.join('|')),
+        //     priority: 20,
+        //     maxSize: ssr === 'client' || ssr === 'ssg' ? 1000000 : Infinity
+        //   })),
+        //   {
+        //     name: 'vendor',
+        //     test: /node_modules/,
+        //     priority: 1
+        //   },
+        //   {
+        //     name: 'typst',
+        //     test: /\.typ/,
+        //     priority: 40
+        //   }
+    ];
+};
 export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command = 'build', mode = 'production', framework = 'vue', debug = false, productName }) => {
     const { getAppDir, getCliDir, getCliViteDir, getSrcDir, getCwd } = await import('./app-urls.js');
     if (!appDir) {
@@ -280,7 +293,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
             },
             load(id) {
                 if (id === 'virtual:vitrify-hooks') {
-                    return `export const onAppMounted = [${onAppMountedHooks
+                    return `const onAppMounted = [${onAppMountedHooks
                         .map((fn) => `${String(fn)}`)
                         .join(', ')}]
             ${onAppMountedFiles
@@ -296,7 +309,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                         return `import ${varName} from '${new URL(url, appDir).href}'; onAppMounted.push(${varName});`;
                     })
                         .join('\n')}
-            export const onAppRendered = [${onAppRenderedHooks
+            const onAppRendered = [${onAppRenderedHooks
                         .map((fn) => `${String(fn)}`)
                         .join(', ')}]
             ${onAppRenderedFiles
@@ -312,7 +325,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                         return `import ${varName} from '${new URL(url, appDir).href}'; onAppRendered.push(${varName});`;
                     })
                         .join('\n')}
-            export const onTemplateRendered = [${onTemplateRenderedHooks
+            const onTemplateRendered = [${onTemplateRenderedHooks
                         .map((fn) => `${String(fn)}`)
                         .join(', ')}]
             ${onTemplateRenderedFiles
@@ -328,7 +341,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                         return `import ${varName} from '${new URL(url, appDir).href}'; onTemplateRendered.push(${varName});`;
                     })
                         .join('\n')}
-            export const onAppCreated = [${OnAppCreatedHooks.map((fn) => `${String(fn)}`).join(', ')}]
+            const onAppCreated = [${OnAppCreatedHooks.map((fn) => `${String(fn)}`).join(', ')}]
             ${onAppCreatedFiles
                         .map((url, index) => {
                         const varName = fileURLToPath(url)
@@ -342,7 +355,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                         return `import ${varName} from '${new URL(url, appDir).href}'; onAppCreated.push(${varName});`;
                     })
                         .join('\n')}
-            export const onSetup = []
+            const onSetup = []
             ${onSetupFiles
                         .map((url, index) => {
                         const varName = fileURLToPath(url)
@@ -355,7 +368,14 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                             .replaceAll('+', '');
                         return `import ${varName} from '${new URL(url, appDir).href}'; onSetup.push(${varName});`;
                     })
-                        .join('\n')}`;
+                        .join('\n')}
+              export const hooks = {
+                onAppMounted,
+                onAppRendered,
+                onAppCreated,
+                onTemplateRendered,
+                onSetup
+              }`;
                 }
                 else if (id === 'virtual:static-imports') {
                     return `${Object.entries(staticImports)
@@ -522,7 +542,9 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                 entryFileNames: '[name].mjs',
                 chunkFileNames: '[name].mjs',
                 format: 'es',
-                manualChunks: manualChunksFn(vitrifyConfig?.vitrify?.manualChunks)
+                codeSplitting: {
+                    groups: createCodeSplittingGroups(ssr)
+                }
             }
         };
         // Create a SSR bundle
@@ -540,7 +562,9 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                 entryFileNames: '[name].mjs',
                 chunkFileNames: '[name].mjs',
                 format: 'es',
-                manualChunks: manualChunksFn(vitrifyConfig?.vitrify?.manualChunks)
+                codeSplitting: {
+                    groups: createCodeSplittingGroups(ssr)
+                }
             }
         };
         // Create a SSR bundle
@@ -557,7 +581,9 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                 entryFileNames: '[name].mjs',
                 chunkFileNames: '[name].mjs',
                 format: 'es',
-                manualChunks: manualChunksFn(vitrifyConfig?.vitrify?.manualChunks)
+                codeSplitting: {
+                    groups: createCodeSplittingGroups(ssr)
+                }
             }
         };
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitrify",
-  "version": "0.26.0",
+  "version": "0.26.1",
   "license": "MIT",
   "author": "Stefan van Herwijnen",
   "description": "Vite as your Full Stack development tool",

package/src/node/bin/dev.ts

@@ -177,7 +177,11 @@ export async function createServer({
         : fileURLToPath(new URL(`src/vite/${framework}/ssr/app.ts`, cliDir))
 
     const environment = vite.environments.ssr
-    ;({ setup, onTemplateRendered, onAppRendered, vitrifyConfig } =
+    ;({
+      setup,
+      hooks: { onTemplateRendered, onAppRendered },
+      vitrifyConfig
+    } =
       // @ts-expect-error missing types
       await environment.runner.import(entryUrl))
 

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

@@ -307,7 +307,9 @@ const loadSSRAssets = async (
     const manifest = JSON.parse(readFileSync(manifestPath).toString())
     const entryServer = await import(entryServerPath)
     const { render, getRoutes } = entryServer
-    const { onTemplateRendered, onAppRendered } = await import(vitrifyHooksPath)
+    const {
+      hooks: { onTemplateRendered, onAppRendered }
+    } = await import(vitrifyHooksPath)
 
     return {
       template,

package/src/node/index.ts

@@ -34,12 +34,12 @@ import type {
 import type { VitrifyContext } from './bin/run.js'
 import type { VitrifyPlugin } from './plugins/index.js'
 import { resolve } from './app-urls.js'
-import type { ManualChunksOption, RollupOptions } from 'rollup'
 import { addOrReplaceTitle, appendToBody } from './helpers/utils.js'
 import Components from 'unplugin-vue-components/vite'
 import { VitePWA } from 'vite-plugin-pwa'
 import UnoCSS from 'unocss/vite'
 import { searchForWorkspaceRoot } from 'vite'
+import { CodeSplittingGroup, RolldownOptions } from 'rolldown'
 
 const internalServerModules = [
   'util',
@@ -60,8 +60,8 @@ const internalServerModules = [
 const manualChunkNames = [
   'prerender',
   'fastify-ssr-plugin',
-  'fastify-csr-plugin',
-  'server'
+  'fastify-csr-plugin'
+  // 'server'
 ]
 
 const moduleChunks = {
@@ -83,31 +83,6 @@ const moduleChunks = {
   quasar: ['quasar'],
   atQuasar: ['@quasar']
 }
-const manualChunksFn = (manualChunkList?: string[]): ManualChunksOption => {
-  return (id: string) => {
-    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)) return name
-    } else if (
-      VIRTUAL_MODULES.some((virtualModule) => id.includes(virtualModule))
-    ) {
-      return VIRTUAL_MODULES.find((name) => id.includes(name))
-    } else if (manualChunkList?.some((file) => id.includes(file))) {
-      return manualChunkList.find((file) => id.includes(file))
-    } else if (id.includes('node_modules')) {
-      if (matchedModule) {
-        return matchedModule[0]
-      }
-      return 'vendor'
-    }
-  }
-}
 
 export const VIRTUAL_MODULES = [
   'virtual:vitrify-hooks',
@@ -117,6 +92,44 @@ export const VIRTUAL_MODULES = [
   'vitrify.css'
 ]
 
+/**
+ * Advanced chunking may no longer be necessary.
+ * @param ssr
+ * @returns
+ */
+const createCodeSplittingGroups = (
+  ssr?: VitrifySSRModes
+): CodeSplittingGroup[] => {
+  return [
+    ...VIRTUAL_MODULES.map((m) => ({
+      name: m,
+      test: new RegExp(m),
+      priority: 30
+    }))
+    // ...manualChunkNames.map((m) => ({
+    //     name: m,
+    //     test: new RegExp(m),
+    //     priority: 20
+    //   })),
+    //   ...Object.entries(moduleChunks).map(([key, value]) => ({
+    //     name: key,
+    //     test: new RegExp(value.join('|')),
+    //     priority: 20,
+    //     maxSize: ssr === 'client' || ssr === 'ssg' ? 1000000 : Infinity
+    //   })),
+    //   {
+    //     name: 'vendor',
+    //     test: /node_modules/,
+    //     priority: 1
+    //   },
+    //   {
+    //     name: 'typst',
+    //     test: /\.typ/,
+    //     priority: 40
+    //   }
+  ]
+}
+
 export const baseConfig = async ({
   ssr,
   appDir,
@@ -358,7 +371,7 @@ export const baseConfig = async ({
       },
       load(id) {
         if (id === 'virtual:vitrify-hooks') {
-          return `export const onAppMounted = [${onAppMountedHooks
+          return `const onAppMounted = [${onAppMountedHooks
             .map((fn) => `${String(fn)}`)
             .join(', ')}]
             ${onAppMountedFiles
@@ -377,7 +390,7 @@ export const baseConfig = async ({
                 }'; onAppMounted.push(${varName});`
               })
               .join('\n')}
-            export const onAppRendered = [${onAppRenderedHooks
+            const onAppRendered = [${onAppRenderedHooks
               .map((fn) => `${String(fn)}`)
               .join(', ')}]
             ${onAppRenderedFiles
@@ -396,7 +409,7 @@ export const baseConfig = async ({
                 }'; onAppRendered.push(${varName});`
               })
               .join('\n')}
-            export const onTemplateRendered = [${onTemplateRenderedHooks
+            const onTemplateRendered = [${onTemplateRenderedHooks
               .map((fn) => `${String(fn)}`)
               .join(', ')}]
             ${onTemplateRenderedFiles
@@ -415,7 +428,7 @@ export const baseConfig = async ({
                 }'; onTemplateRendered.push(${varName});`
               })
               .join('\n')}
-            export const onAppCreated = [${OnAppCreatedHooks.map(
+            const onAppCreated = [${OnAppCreatedHooks.map(
               (fn) => `${String(fn)}`
             ).join(', ')}]
             ${onAppCreatedFiles
@@ -434,7 +447,7 @@ export const baseConfig = async ({
                 }'; onAppCreated.push(${varName});`
               })
               .join('\n')}
-            export const onSetup = []
+            const onSetup = []
             ${onSetupFiles
               .map((url, index) => {
                 const varName = fileURLToPath(url)
@@ -450,7 +463,14 @@ export const baseConfig = async ({
                   new URL(url, appDir).href
                 }'; onSetup.push(${varName});`
               })
-              .join('\n')}`
+              .join('\n')}
+              export const hooks = {
+                onAppMounted,
+                onAppRendered,
+                onAppCreated,
+                onTemplateRendered,
+                onSetup
+              }`
         } else if (id === 'virtual:static-imports') {
           return `${Object.entries(staticImports)
             .map(([key, value]) => {
@@ -623,7 +643,7 @@ export const baseConfig = async ({
       replacement: fileURLToPath(new URL(await resolve('vitest', cliDir)))
     })
 
-  let rollupOptions: RollupOptions = {}
+  let rollupOptions: RolldownOptions = {}
   let noExternal: RegExp[] | string[] = [
     new RegExp(`^(?!(${[...builtinModules, ...serverModules].join('|')}))`)
   ]
@@ -644,7 +664,9 @@ export const baseConfig = async ({
         entryFileNames: '[name].mjs',
         chunkFileNames: '[name].mjs',
         format: 'es',
-        manualChunks: manualChunksFn(vitrifyConfig?.vitrify?.manualChunks)
+        codeSplitting: {
+          groups: createCodeSplittingGroups(ssr)
+        }
       }
     }
     // Create a SSR bundle
@@ -661,7 +683,9 @@ export const baseConfig = async ({
         entryFileNames: '[name].mjs',
         chunkFileNames: '[name].mjs',
         format: 'es',
-        manualChunks: manualChunksFn(vitrifyConfig?.vitrify?.manualChunks)
+        codeSplitting: {
+          groups: createCodeSplittingGroups(ssr)
+        }
       }
     }
     // Create a SSR bundle
@@ -677,7 +701,9 @@ export const baseConfig = async ({
         entryFileNames: '[name].mjs',
         chunkFileNames: '[name].mjs',
         format: 'es',
-        manualChunks: manualChunksFn(vitrifyConfig?.vitrify?.manualChunks)
+        codeSplitting: {
+          groups: createCodeSplittingGroups(ssr)
+        }
       }
     }
   }

package/src/vite/fastify/entry.ts

@@ -1,12 +1,14 @@
 import type { FastifyInstance } from 'fastify'
-import { onSetup } from 'virtual:vitrify-hooks'
+import { hooks } from 'virtual:vitrify-hooks'
 export { default as vitrifyConfig } from 'virtual:vitrify-config'
 
 export const setup = async ({ fastify }: { fastify: FastifyInstance }) => {
-  if (onSetup?.length) {
-    for (const setup of onSetup) {
+  if (hooks.onSetup?.length) {
+    for (const setup of hooks.onSetup) {
       await setup(fastify)
     }
   }
   return fastify
 }
+
+export { hooks }

package/src/vite/vue/RootComponent.vue

@@ -8,15 +8,17 @@ import {
   onMounted as onMountedVue,
   getCurrentInstance
 } from 'vue'
-import { onAppMounted } from 'virtual:vitrify-hooks'
+import { hooks } from 'virtual:vitrify-hooks'
 import App from 'src/App.vue'
 // import 'vitrify.sass'
 const instance = getCurrentInstance()
 const props = defineProps()
 
 onMountedVue(async () => {
-  for (let fn of onAppMounted) {
-    await fn({ instance })
+  if (hooks.onAppMounted) {
+    for (let fn of hooks.onAppMounted) {
+      await fn({ instance })
+    }
   }
 })
 

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

@@ -1,7 +1,7 @@
 import { createApp } from '../../../node/frameworks/vue/server.js'
 import { getAppDir } from '../../../node/app-urls.js'
 // import { setup } from 'virtual:fastify-setup'
-import { onSetup } from 'virtual:vitrify-hooks'
+import { hooks } from 'virtual:vitrify-hooks'
 import { fastifyCsrPlugin } from './fastify-csr-plugin'
 
 // const appDir = getPkgJsonDir(import.meta.url)
@@ -12,7 +12,7 @@ const appDir = getAppDir()
 export const setupApp = async () => {
   // const vitrifyDir = new URL('../', await resolve('vitrify', new URL(import.meta.url)))
   return createApp({
-    onSetup,
+    onSetup: hooks.onSetup,
     appDir,
     baseUrl,
     fastifyPlugin: fastifyCsrPlugin,

package/src/vite/vue/main.ts

@@ -1,6 +1,6 @@
 import createRouter from 'src/router'
 import { App, createSSRApp, createApp as createVueApp, ref } from 'vue'
-import { onBoot, onAppCreated } from 'virtual:vitrify-hooks'
+import { hooks } from 'virtual:vitrify-hooks'
 import routes from 'src/router/routes'
 import * as staticImports from 'virtual:static-imports'
 import 'virtual:uno.css'
@@ -69,8 +69,10 @@ export async function createApp(
   const router = createRouter()
   app.use(router)
 
-  for (const fn of onAppCreated) {
-    await fn({ app, router, ctx, initialState, ssrContext, staticImports })
+  if (hooks.onAppCreated) {
+    for (const fn of hooks.onAppCreated) {
+      await fn({ app, router, ctx, initialState, ssrContext, staticImports })
+    }
   }
 
   // Workaround to fix hydration errors when serving html files directly

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

@@ -1,10 +1,6 @@
 import { createApp } from '../../../node/frameworks/vue/server.js'
 import { getAppDir } from '../../../node/app-urls.js'
-import {
-  onSetup,
-  onAppRendered,
-  onTemplateRendered
-} from 'virtual:vitrify-hooks'
+import { hooks } from 'virtual:vitrify-hooks'
 import { fastifySsrPlugin } from './fastify-ssr-plugin.js'
 
 const getString = (str?: string) => str
@@ -13,15 +9,15 @@ const appDir = getAppDir()
 
 export const setupApp = async () => {
   return createApp({
-    onSetup,
+    onSetup: hooks.onSetup,
     appDir,
     baseUrl,
     fastifyPlugin: fastifySsrPlugin,
-    onAppRendered,
-    onTemplateRendered,
+    onAppRendered: hooks.onAppRendered,
+    onTemplateRendered: hooks.onTemplateRendered,
     mode: import.meta.env.MODE
   })
 }
 
 export { default as vitrifyConfig } from 'virtual:vitrify-config'
-export { onAppRendered, onTemplateRendered }
+export { hooks }

package/src/vite/vue/ssr/prerender.ts

@@ -1,4 +1,4 @@
 import { prerender } from '../../../node/frameworks/vue/prerender.js'
-import { onTemplateRendered } from 'virtual:vitrify-hooks'
+import { hooks } from 'virtual:vitrify-hooks'
 
-export { prerender, onTemplateRendered }
+export { prerender, hooks }

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

@@ -1,4 +1,5 @@
 import { setupApp } from './app'
+import { hooks } from 'virtual:vitrify-hooks'
 
 const app = await setupApp()
 
@@ -6,3 +7,5 @@ app.listen({
   port: Number(process.env.PORT || 3000),
   host: process.env.HOST || 'localhost'
 })
+
+export { hooks }