vitrify 0.5.0 → 0.5.3

package/dist/bin/build.js

@@ -8,11 +8,12 @@ export async function build(opts) {
         ssr: opts?.ssr,
         appDir: opts.appDir,
         publicDir: opts.publicDir,
-        base: opts.base
+        base: opts.base,
+        debug: opts.debug
     });
     config.build = {
         ...config.build,
-        minify: false,
+        minify: !opts.debug,
         outDir: opts.outDir,
         emptyOutDir: !!opts.outDir
     };

package/dist/bin/cli.js

@@ -11,6 +11,7 @@ cli
     .option('--appDir [appDir]', 'App directory')
     .option('--publicDir [publicDir]', 'Public directory')
     .option('--productName [productName]', 'Product name')
+    .option('--debug', 'Debug build')
     .action(async (options) => {
     const { build } = await import('./build.js');
     let appDir;
@@ -27,7 +28,8 @@ cli
     const args = {
         base: options.base,
         appDir,
-        publicDir: parsePath(options.publicDir, appDir)
+        publicDir: parsePath(options.publicDir, appDir),
+        debug: options.debug
     };
     switch (options.mode) {
         case 'csr':

package/dist/bin/dev.js

@@ -25,11 +25,11 @@ ssr, framework = 'vue', host, appDir, publicDir, base }) {
         base
     });
     config.logLevel = logLevel;
-    console.log(searchForWorkspaceRoot(appDir.pathname));
     config.server = {
         https: config.server?.https,
         hmr: {
-            protocol: config.server?.https ? 'wss' : 'ws'
+            protocol: config.server?.https ? 'wss' : 'ws',
+            port: 24678
         },
         port,
         // middlewareMode: mode === 'ssr' ? 'ssr' : undefined,

package/dist/index.js

@@ -7,38 +7,16 @@ import { pathToFileURL } from 'url';
 import { readFileSync } from 'fs';
 import builtinModules from 'builtin-modules';
 import { resolve } from 'import-meta-resolve';
+import { visualizer } from 'rollup-plugin-visualizer';
 import { getPkgJsonDir } from './app-urls.js';
 const internalServerModules = [
-    // 'fs',
-    // 'path',
-    // 'url',
-    // 'module',
-    // 'crypto',
-    // 'node:fs',
     'util',
-    'node:url',
-    'node:util',
-    'node:fs',
-    'node:process',
     'vitrify',
     'vitrify/dev',
-    // 'import-meta-resolve',
     'vite',
     'fastify',
-    '@fastify',
+    '@fastify/static',
     'node'
-    // 'middie',
-    // 'knex',
-    // 'bcrypt',
-    // 'objection',
-    // '@fastify/formbody',
-    // '@fastify/static',
-    // '@fastify/cors',
-    // '@fastify/cookie',
-    // 'mercurius',
-    // 'jose',
-    // 'oidc-provider',
-    // 'node-fetch'
 ];
 const configPluginMap = {
     quasar: () => import('./plugins/quasar.js').then((module) => module.QuasarPlugin)
@@ -55,6 +33,9 @@ const manualChunks = (id) => {
         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 (id.includes('node_modules')) {
         return 'vendor';
     }
@@ -62,7 +43,9 @@ const manualChunks = (id) => {
 export const VIRTUAL_MODULES = [
     'virtual:vitrify-hooks',
     'virtual:global-css',
-    'virtual:static-imports'
+    'virtual:static-imports',
+    'vitrify.sass',
+    'vitrify.css'
 ];
 async function bundleConfigFile(fileName, isESM = false) {
     const result = await build({
@@ -112,7 +95,7 @@ async function bundleConfigFile(fileName, isESM = false) {
         dependencies: result.metafile ? Object.keys(result.metafile.inputs) : []
     };
 }
-export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command = 'build', mode = 'production', framework = 'vue', pwa = false }) => {
+export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command = 'build', mode = 'production', framework = 'vue', pwa = false, debug = false }) => {
     const { getAppDir, getCliDir, getCliViteDir, getSrcDir, getCwd } = await import('./app-urls.js');
     if (!appDir) {
         appDir = getAppDir();
@@ -194,6 +177,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
     let staticImports;
     let sassVariables;
     let additionalData;
+    let globalSass;
     let serverModules = internalServerModules;
     if (vitrifyConfig.vitrify?.ssr?.serverModules)
         serverModules = [
@@ -234,17 +218,20 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                 globalCss = config.vitrify?.globalCss || [];
                 staticImports = config.vitrify?.staticImports || {};
                 sassVariables = config.vitrify?.sass?.variables || {};
+                globalSass = config.vitrify?.sass?.global || [];
                 additionalData = config.vitrify?.sass?.additionalData || [];
                 return {
                     css: {
                         preprocessorOptions: {
-                            sass: {
-                                additionalData: [
-                                    ...Object.entries(sassVariables).map(([key, value]) => `${key}: ${value}`),
-                                    ...additionalData
-                                    // config.css?.preprocessorOptions?.sass.additionalData
-                                ].join('\n')
-                            }
+                        // sass: {
+                        //   additionalData: [
+                        //     ...Object.entries(sassVariables).map(
+                        //       ([key, value]) => `${key}: ${value}`
+                        //     )
+                        //     // ...additionalData
+                        //     // config.css?.preprocessorOptions?.sass.additionalData
+                        //   ].join('\n')
+                        // }
                         }
                     }
                 };
@@ -257,7 +244,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
             },
             resolveId(id) {
                 if (VIRTUAL_MODULES.includes(id))
-                    return { id, moduleSideEffects: false };
+                    return { id };
                 return;
             },
             transform: (code, id) => {
@@ -300,6 +287,15 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                         .map(([key, value]) => `export { ${value.join(',')} } from '${key}';`)
                         .join('\n')}`;
                 }
+                else if (id === 'vitrify.sass') {
+                    return [
+                        ...Object.entries(sassVariables).map(([key, value]) => `${key}: ${value}`),
+                        ...globalSass.map((sass) => `@import '${sass}'`)
+                    ].join('\n');
+                }
+                else if (id === 'vitrify.css') {
+                    return `${globalCss.map((css) => `import '${css}'`).join('\n')}`;
+                }
                 return null;
             }
         }
@@ -357,6 +353,8 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
                 }
             }
         });
+        if (debug)
+            plugins.push(visualizer());
     }
     const alias = [
         { find: 'src', replacement: srcDir.pathname },
@@ -386,6 +384,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
     const external = [...builtinModules, ...serverModules];
     if (ssr === 'server') {
         rollupOptions = {
+            ...rollupOptions,
             input: [
                 new URL('ssr/entry-server.ts', frameworkDir).pathname,
                 new URL('ssr/prerender.ts', frameworkDir).pathname,
@@ -393,7 +392,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
             ],
             external,
             output: {
-                minifyInternalExports: false,
+                minifyInternalExports: !debug,
                 entryFileNames: '[name].mjs',
                 chunkFileNames: '[name].mjs',
                 format: 'es',
@@ -416,6 +415,7 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
     }
     else if (ssr === 'fastify') {
         rollupOptions = {
+            ...rollupOptions,
             input: [new URL('server.ts', fastifyDir).pathname],
             external,
             output: {
@@ -441,13 +441,14 @@ export const baseConfig = async ({ ssr, appDir, publicDir, base = '/', command =
     }
     else {
         rollupOptions = {
-            input: [
-                new URL('index.html', frameworkDir).pathname
-                // new URL('csr/server.ts', frameworkDir).pathname
-            ],
+            ...rollupOptions,
+            // input: [
+            //   new URL('index.html', frameworkDir).pathname
+            //   // new URL('csr/server.ts', frameworkDir).pathname
+            // ],
             external,
             output: {
-                minifyInternalExports: false,
+                minifyInternalExports: !debug,
                 entryFileNames: '[name].mjs',
                 chunkFileNames: '[name].mjs',
                 format: 'es',

package/dist/plugins/quasar.js

@@ -44,9 +44,9 @@ export const QuasarPlugin = async ({ ssr = false, pwa = false }) => {
                 const { ssr } = options || {};
                 code = code
                     .replaceAll('__QUASAR_SSR__', ssr ? ssr.toString() : 'false')
-                    .replaceAll('__QUASAR_SSR_SERVER__', 'import.meta.env.SSR')
-                    .replaceAll('__QUASAR_SSR_CLIENT__', '!import.meta.env.SSR')
-                    .replaceAll('__QUASAR_SSR_PWA__', pwa ? '!import.meta.env.SSR' : 'false');
+                    .replaceAll('__QUASAR_SSR_SERVER__', ssr ? 'import.meta.env.SSR' : 'false')
+                    .replaceAll('__QUASAR_SSR_CLIENT__', ssr ? '!import.meta.env.SSR' : 'false')
+                    .replaceAll('__QUASAR_SSR_PWA__', ssr && pwa ? '!import.meta.env.SSR' : 'false');
                 return code;
             }
         },
@@ -93,7 +93,8 @@ export const QuasarPlugin = async ({ ssr = false, pwa = false }) => {
                             onRendered: [injectSsrContext]
                         },
                         sass: {
-                            additionalData: [`@import 'quasar/src/css/index.sass'`]
+                            global: ['quasar/src/css/index.sass']
+                            // additionalData: [`@import 'quasar/src/css/index.sass'`]
                         }
                     }
                 };
@@ -149,20 +150,17 @@ export const QuasarPlugin = async ({ ssr = false, pwa = false }) => {
                                 find: 'quasar/src',
                                 replacement: new URL('src/', urls?.packages?.quasar).pathname
                             },
-                            {
-                                find: new RegExp('^quasar$'),
-                                replacement: new URL('src/index.all.js', urls?.packages?.quasar)
-                                    .pathname
-                            },
                             // {
-                            //   find: 'quasar',
-                            //   replacement: new URL('src/index.all.js', urls?.packages?.quasar).pathname
+                            //   find: new RegExp('^quasar$'),
+                            //   replacement: new URL('src/index.all.js', urls?.packages?.quasar)
+                            //     .pathname
                             // },
                             {
                                 find: `@quasar/extras`,
                                 replacement: new URL('.', urls?.packages?.['@quasar/extras'])
                                     .pathname
                             }
+                            // { find: new RegExp('^quasar$'), replacement: 'virtual:quasar' }
                         ]
                     },
                     define: {
@@ -184,7 +182,7 @@ export const QuasarPlugin = async ({ ssr = false, pwa = false }) => {
         },
         {
             name: 'quasar-virtual-modules',
-            enforce: 'post',
+            enforce: 'pre',
             config: async (config, env) => ({
                 resolve: {
                     alias: [
@@ -196,8 +194,8 @@ export const QuasarPlugin = async ({ ssr = false, pwa = false }) => {
                 switch (id) {
                     case 'virtual:quasar-plugins':
                         return 'virtual:quasar-plugins';
-                    case 'virtual:quasar':
-                        return { id: 'virtual:quasar', moduleSideEffects: false };
+                    case 'quasar':
+                        return { id: 'quasar', moduleSideEffects: false };
                     default:
                         return;
                 }
@@ -206,7 +204,7 @@ export const QuasarPlugin = async ({ ssr = false, pwa = false }) => {
                 if (id === 'virtual:quasar-plugins') {
                     return `export { ${plugins.join(',')} } from 'quasar'`;
                 }
-                else if (id === 'virtual:quasar') {
+                else if (id === 'quasar') {
                     return `export * from 'quasar/src/plugins.js';
           export * from 'quasar/src/components.js';
           export * from 'quasar/src/composables.js';

package/dist/types/bin/build.d.ts

@@ -5,4 +5,5 @@ export declare function build(opts: {
     outDir: string;
     appDir?: URL;
     publicDir?: URL;
+    debug?: boolean;
 }): Promise<import("rollup").RollupOutput | import("rollup").RollupOutput[] | import("rollup").RollupWatcher>;

package/dist/types/bin/dev.d.ts

@@ -48,6 +48,7 @@ export declare function createServer({ port, logLevel, ssr, framework, host, app
         createResolver: (options?: Partial<import("vite").InternalResolveOptions> | undefined) => import("vite").ResolveFn;
         optimizeDeps: import("vite").DepOptimizationOptions;
         worker: import("vite").ResolveWorkerOptions;
-        spa: boolean;
+        appType: import("vite").AppType;
+        experimental: import("vite").ResolvedExperimentalOptions;
     }>;
 }>;

package/dist/types/index.d.ts

@@ -3,7 +3,7 @@ import type { BootFunction, VitrifyConfig } from './vitrify-config.js';
 import type { VitrifyContext } from './bin/run.js';
 import type { VitrifyPlugin } from './plugins/index.js';
 export declare const VIRTUAL_MODULES: string[];
-export declare const baseConfig: ({ ssr, appDir, publicDir, base, command, mode, framework, pwa }: {
+export declare const baseConfig: ({ ssr, appDir, publicDir, base, command, mode, framework, pwa, debug }: {
     ssr?: "server" | "client" | "ssg" | "fastify" | undefined;
     appDir?: URL | undefined;
     publicDir?: URL | undefined;
@@ -12,6 +12,7 @@ export declare const baseConfig: ({ ssr, appDir, publicDir, base, command, mode,
     mode?: "production" | "development" | undefined;
     framework?: "vue" | undefined;
     pwa?: boolean | undefined;
+    debug?: boolean | undefined;
 }) => Promise<InlineConfig>;
 export declare const vitrifyDir: URL;
 export type { VitrifyConfig, VitrifyPlugin, VitrifyContext, BootFunction };

package/dist/types/vitrify-config.d.ts

@@ -50,6 +50,7 @@ export interface VitrifyConfig extends UserConfig {
         sass?: {
             variables?: Record<string, string>;
             additionalData?: string[];
+            global?: string[];
         };
         /**
          * Product name of the application. Will be used for the HTML title tag

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitrify",
-  "version": "0.5.0",
+  "version": "0.5.3",
   "license": "MIT",
   "author": "Stefan van Herwijnen",
   "description": "Pre-configured Vite CLI for your framework",
@@ -68,10 +68,11 @@
     "magic-string": "^0.26.2",
     "merge-deep": "^3.0.3",
     "readline": "^1.3.0",
+    "rollup-plugin-visualizer": "^5.6.0",
     "sass": "1.52.3",
     "ts-node": "^10.8.1",
     "unplugin-vue-components": "^0.19.6",
-    "vite": "^3.0.0-alpha.11",
+    "vite": "^3.0.0-beta.0",
     "vitest": "^0.14.1"
   },
   "devDependencies": {
@@ -92,11 +93,10 @@
   "peerDependencies": {
     "@fastify/static": "^6.4.0",
     "fastify": "^4.0.0",
-    "fastify-plugin": "^3.0.1",
+    "import-meta-resolve": "^2.0.3",
     "quasar": "^2.7.1",
     "vue": "^3.2.37",
-    "vue-router": "^4.0.15",
-    "import-meta-resolve": "^2.0.3"
+    "vue-router": "^4.0.15"
   },
   "publishConfig": {
     "access": "public",

package/src/node/bin/build.ts

@@ -8,6 +8,7 @@ export async function build(opts: {
   outDir: string
   appDir?: URL
   publicDir?: URL
+  debug?: boolean
 }) {
   const config = await baseConfig({
     command: 'build',
@@ -15,12 +16,13 @@ export async function build(opts: {
     ssr: opts?.ssr,
     appDir: opts.appDir,
     publicDir: opts.publicDir,
-    base: opts.base
+    base: opts.base,
+    debug: opts.debug
   })
 
   config.build = {
     ...config.build,
-    minify: false,
+    minify: !opts.debug,
     outDir: opts.outDir,
     emptyOutDir: !!opts.outDir
   }

package/src/node/bin/cli.ts

@@ -20,6 +20,7 @@ cli
   .option('--appDir [appDir]', 'App directory')
   .option('--publicDir [publicDir]', 'Public directory')
   .option('--productName [productName]', 'Product name')
+  .option('--debug', 'Debug build')
   .action(async (options) => {
     const { build } = await import('./build.js')
     let appDir: URL
@@ -38,10 +39,12 @@ cli
       base: string
       appDir?: URL
       publicDir?: URL
+      debug?: boolean
     } = {
       base: options.base,
       appDir,
-      publicDir: parsePath(options.publicDir, appDir)
+      publicDir: parsePath(options.publicDir, appDir),
+      debug: options.debug
     }
 
     switch (options.mode) {

package/src/node/bin/dev.ts

@@ -52,11 +52,11 @@ export async function createVitrifyDevServer({
 
   config.logLevel = logLevel
 
-  console.log(searchForWorkspaceRoot(appDir.pathname))
   config.server = {
     https: config.server?.https,
     hmr: {
-      protocol: config.server?.https ? 'wss' : 'ws'
+      protocol: config.server?.https ? 'wss' : 'ws',
+      port: 24678
     },
     port,
     // middlewareMode: mode === 'ssr' ? 'ssr' : undefined,

package/src/node/index.ts

@@ -9,6 +9,7 @@ import { pathToFileURL } from 'url'
 import { readFileSync } from 'fs'
 import builtinModules from 'builtin-modules'
 import { resolve } from 'import-meta-resolve'
+import { visualizer } from 'rollup-plugin-visualizer'
 import type {
   StaticImports,
   BootFunction,
@@ -21,39 +22,16 @@ import type {
 import type { VitrifyContext } from './bin/run.js'
 import type { VitrifyPlugin } from './plugins/index.js'
 import { getPkgJsonDir } from './app-urls.js'
-import type { RollupOptions } from 'rollup'
+import type { ManualChunksOption, RollupOptions } from 'rollup'
 
 const internalServerModules = [
-  // 'fs',
-  // 'path',
-  // 'url',
-  // 'module',
-  // 'crypto',
-  // 'node:fs',
   'util',
-  'node:url',
-  'node:util',
-  'node:fs',
-  'node:process',
   'vitrify',
   'vitrify/dev',
-  // 'import-meta-resolve',
   'vite',
   'fastify',
-  '@fastify',
+  '@fastify/static',
   'node'
-  // 'middie',
-  // 'knex',
-  // 'bcrypt',
-  // 'objection',
-  // '@fastify/formbody',
-  // '@fastify/static',
-  // '@fastify/cors',
-  // '@fastify/cookie',
-  // 'mercurius',
-  // 'jose',
-  // 'oidc-provider',
-  // 'node-fetch'
 ]
 
 const configPluginMap: Record<string, () => Promise<VitrifyPlugin>> = {
@@ -67,10 +45,14 @@ const manualChunkNames = [
   'fastify-csr-plugin',
   'server'
 ]
-const manualChunks = (id: string) => {
+const manualChunks: ManualChunksOption = (id: string) => {
   if (id.includes('vitrify/src/vite/')) {
     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 (id.includes('node_modules')) {
     return 'vendor'
   }
@@ -79,7 +61,9 @@ const manualChunks = (id: string) => {
 export const VIRTUAL_MODULES = [
   'virtual:vitrify-hooks',
   'virtual:global-css',
-  'virtual:static-imports'
+  'virtual:static-imports',
+  'vitrify.sass',
+  'vitrify.css'
 ]
 
 async function bundleConfigFile(
@@ -148,7 +132,8 @@ export const baseConfig = async ({
   command = 'build',
   mode = 'production',
   framework = 'vue',
-  pwa = false
+  pwa = false,
+  debug = false
 }: {
   ssr?: 'client' | 'server' | 'ssg' | 'fastify'
   appDir?: URL
@@ -158,6 +143,7 @@ export const baseConfig = async ({
   mode?: 'production' | 'development'
   framework?: 'vue'
   pwa?: boolean
+  debug?: boolean
 }): Promise<InlineConfig> => {
   const { getAppDir, getCliDir, getCliViteDir, getSrcDir, getCwd } =
     await import('./app-urls.js')
@@ -263,6 +249,7 @@ export const baseConfig = async ({
   let staticImports: StaticImports
   let sassVariables: Record<string, string>
   let additionalData: string[]
+  let globalSass: string[]
   let serverModules: string[] = internalServerModules
 
   if (vitrifyConfig.vitrify?.ssr?.serverModules)
@@ -305,20 +292,21 @@ export const baseConfig = async ({
         globalCss = config.vitrify?.globalCss || []
         staticImports = config.vitrify?.staticImports || {}
         sassVariables = config.vitrify?.sass?.variables || {}
+        globalSass = config.vitrify?.sass?.global || []
         additionalData = config.vitrify?.sass?.additionalData || []
 
         return {
           css: {
             preprocessorOptions: {
-              sass: {
-                additionalData: [
-                  ...Object.entries(sassVariables).map(
-                    ([key, value]) => `${key}: ${value}`
-                  ),
-                  ...additionalData
-                  // config.css?.preprocessorOptions?.sass.additionalData
-                ].join('\n')
-              }
+              // sass: {
+              //   additionalData: [
+              //     ...Object.entries(sassVariables).map(
+              //       ([key, value]) => `${key}: ${value}`
+              //     )
+              //     // ...additionalData
+              //     // config.css?.preprocessorOptions?.sass.additionalData
+              //   ].join('\n')
+              // }
             }
           }
         }
@@ -330,8 +318,7 @@ export const baseConfig = async ({
         }
       },
       resolveId(id) {
-        if (VIRTUAL_MODULES.includes(id))
-          return { id, moduleSideEffects: false }
+        if (VIRTUAL_MODULES.includes(id)) return { id }
         return
       },
       transform: (code, id) => {
@@ -379,6 +366,15 @@ export const baseConfig = async ({
               ([key, value]) => `export { ${value.join(',')} } from '${key}';`
             )
             .join('\n')}`
+        } else if (id === 'vitrify.sass') {
+          return [
+            ...Object.entries(sassVariables).map(
+              ([key, value]) => `${key}: ${value}`
+            ),
+            ...globalSass.map((sass) => `@import '${sass}'`)
+          ].join('\n')
+        } else if (id === 'vitrify.css') {
+          return `${globalCss.map((css) => `import '${css}'`).join('\n')}`
         }
         return null
       }
@@ -438,6 +434,8 @@ export const baseConfig = async ({
         }
       }
     })
+
+    if (debug) plugins.push(visualizer())
   }
 
   const alias: Alias[] = [
@@ -471,6 +469,7 @@ export const baseConfig = async ({
 
   if (ssr === 'server') {
     rollupOptions = {
+      ...rollupOptions,
       input: [
         new URL('ssr/entry-server.ts', frameworkDir).pathname,
         new URL('ssr/prerender.ts', frameworkDir).pathname,
@@ -478,7 +477,7 @@ export const baseConfig = async ({
       ],
       external,
       output: {
-        minifyInternalExports: false,
+        minifyInternalExports: !debug,
         entryFileNames: '[name].mjs',
         chunkFileNames: '[name].mjs',
         format: 'es',
@@ -500,6 +499,7 @@ export const baseConfig = async ({
     ]
   } else if (ssr === 'fastify') {
     rollupOptions = {
+      ...rollupOptions,
       input: [new URL('server.ts', fastifyDir).pathname],
       external,
       output: {
@@ -524,13 +524,14 @@ export const baseConfig = async ({
     ]
   } else {
     rollupOptions = {
-      input: [
-        new URL('index.html', frameworkDir).pathname
-        // new URL('csr/server.ts', frameworkDir).pathname
-      ],
+      ...rollupOptions,
+      // input: [
+      //   new URL('index.html', frameworkDir).pathname
+      //   // new URL('csr/server.ts', frameworkDir).pathname
+      // ],
       external,
       output: {
-        minifyInternalExports: false,
+        minifyInternalExports: !debug,
         entryFileNames: '[name].mjs',
         chunkFileNames: '[name].mjs',
         format: 'es',

package/src/node/plugins/quasar.ts

@@ -13,6 +13,7 @@ import type {
 import { QuasarResolver } from 'unplugin-vue-components/resolvers'
 import type { VitrifyPlugin } from './index.js'
 import { getPkgJsonDir } from '../app-urls.js'
+
 import { resolve } from 'import-meta-resolve'
 
 export interface QuasarConf {
@@ -92,11 +93,17 @@ export const QuasarPlugin: VitrifyPlugin = async ({
         const { ssr } = options || {}
         code = code
           .replaceAll('__QUASAR_SSR__', ssr ? ssr.toString() : 'false')
-          .replaceAll('__QUASAR_SSR_SERVER__', 'import.meta.env.SSR')
-          .replaceAll('__QUASAR_SSR_CLIENT__', '!import.meta.env.SSR')
+          .replaceAll(
+            '__QUASAR_SSR_SERVER__',
+            ssr ? 'import.meta.env.SSR' : 'false'
+          )
+          .replaceAll(
+            '__QUASAR_SSR_CLIENT__',
+            ssr ? '!import.meta.env.SSR' : 'false'
+          )
           .replaceAll(
             '__QUASAR_SSR_PWA__',
-            pwa ? '!import.meta.env.SSR' : 'false'
+            ssr && pwa ? '!import.meta.env.SSR' : 'false'
           )
 
         return code
@@ -161,7 +168,8 @@ export const QuasarPlugin: VitrifyPlugin = async ({
               onRendered: [injectSsrContext]
             },
             sass: {
-              additionalData: [`@import 'quasar/src/css/index.sass'`]
+              global: ['quasar/src/css/index.sass']
+              // additionalData: [`@import 'quasar/src/css/index.sass'`]
             }
           }
         }
@@ -225,7 +233,6 @@ export const QuasarPlugin: VitrifyPlugin = async ({
                   urls?.packages?.quasar
                 ).pathname
               },
-
               {
                 find: 'quasar/directives',
                 replacement: new URL(
@@ -237,20 +244,17 @@ export const QuasarPlugin: VitrifyPlugin = async ({
                 find: 'quasar/src',
                 replacement: new URL('src/', urls?.packages?.quasar).pathname
               },
-              {
-                find: new RegExp('^quasar$'),
-                replacement: new URL('src/index.all.js', urls?.packages?.quasar)
-                  .pathname
-              },
               // {
-              //   find: 'quasar',
-              //   replacement: new URL('src/index.all.js', urls?.packages?.quasar).pathname
+              //   find: new RegExp('^quasar$'),
+              //   replacement: new URL('src/index.all.js', urls?.packages?.quasar)
+              //     .pathname
               // },
               {
                 find: `@quasar/extras`,
                 replacement: new URL('.', urls?.packages?.['@quasar/extras'])
                   .pathname
               }
+              // { find: new RegExp('^quasar$'), replacement: 'virtual:quasar' }
             ]
           },
           define: {
@@ -272,7 +276,7 @@ export const QuasarPlugin: VitrifyPlugin = async ({
     },
     {
       name: 'quasar-virtual-modules',
-      enforce: 'post',
+      enforce: 'pre',
       config: async (config, env) => ({
         resolve: {
           alias: [
@@ -284,8 +288,8 @@ export const QuasarPlugin: VitrifyPlugin = async ({
         switch (id) {
           case 'virtual:quasar-plugins':
             return 'virtual:quasar-plugins'
-          case 'virtual:quasar':
-            return { id: 'virtual:quasar', moduleSideEffects: false }
+          case 'quasar':
+            return { id: 'quasar', moduleSideEffects: false }
           default:
             return
         }
@@ -293,7 +297,7 @@ export const QuasarPlugin: VitrifyPlugin = async ({
       load(id) {
         if (id === 'virtual:quasar-plugins') {
           return `export { ${plugins.join(',')} } from 'quasar'`
-        } else if (id === 'virtual:quasar') {
+        } else if (id === 'quasar') {
           return `export * from 'quasar/src/plugins.js';
           export * from 'quasar/src/components.js';
           export * from 'quasar/src/composables.js';

package/src/node/vitrify-config.ts

@@ -1,4 +1,3 @@
-import type { FastifyInstance } from 'fastify'
 import type { Alias, UserConfig } from 'vite'
 import type { QuasarConf } from './plugins/quasar.js'
 import type { ComponentInternalInstance } from '@vue/runtime-core'
@@ -72,6 +71,7 @@ export interface VitrifyConfig extends UserConfig {
     sass?: {
       variables?: Record<string, string>
       additionalData?: string[]
+      global?: string[]
     }
     /**
      * Product name of the application. Will be used for the HTML title tag

package/src/vite/vue/main.ts

@@ -1,3 +1,5 @@
+// import 'vitrify.css'
+import 'vitrify.sass'
 import App from 'src/App.vue'
 import createRouter from 'src/router'
 import {