|
| 1 | +import type { Nuxt } from '@nuxt/schema' |
| 2 | +import type { VuetifyNuxtContext } from './config' |
| 3 | +import { createHash } from 'node:crypto' |
| 4 | +import { existsSync, mkdirSync, readdirSync, readFileSync, rmSync, statSync, writeFileSync } from 'node:fs' |
| 5 | +import { dirname, join, relative, resolve } from 'node:path' |
| 6 | +import { pathToFileURL } from 'node:url' |
| 7 | +import { resolvePath } from '@nuxt/kit' |
| 8 | + |
| 9 | +import { isObject, normalizePath, resolveVuetifyBase } from '@vuetify/loader-shared' |
| 10 | + |
| 11 | +export async function prepareVuetifyStyles (nuxt: Nuxt, ctx: VuetifyNuxtContext) { |
| 12 | + const stylesConfig = ctx.moduleOptions.styles |
| 13 | + |
| 14 | + if (!isObject(stylesConfig) || !('configFile' in stylesConfig)) { |
| 15 | + return |
| 16 | + } |
| 17 | + |
| 18 | + if (stylesConfig.experimental?.cache === false) { |
| 19 | + return |
| 20 | + } |
| 21 | + |
| 22 | + const vuetifyBase = resolveVuetifyBase() |
| 23 | + let configFile: string | undefined |
| 24 | + let configContent = '' |
| 25 | + |
| 26 | + if (stylesConfig.configFile) { |
| 27 | + configFile = await resolvePath(stylesConfig.configFile) |
| 28 | + if (existsSync(configFile)) { |
| 29 | + configContent = readFileSync(configFile, 'utf8') |
| 30 | + // Add to watch list |
| 31 | + if (!ctx.vuetifyFilesToWatch.includes(configFile)) { |
| 32 | + ctx.vuetifyFilesToWatch.push(configFile) |
| 33 | + } |
| 34 | + } |
| 35 | + } |
| 36 | + |
| 37 | + if (!configFile) { |
| 38 | + return |
| 39 | + } |
| 40 | + |
| 41 | + // Calculate hash |
| 42 | + const hash = createHash('sha256') |
| 43 | + .update(ctx.vuetifyVersion) |
| 44 | + .update(ctx.viteVersion) |
| 45 | + .update(configContent) |
| 46 | + .update(configFile) |
| 47 | + .digest('hex') |
| 48 | + .slice(0, 8) |
| 49 | + |
| 50 | + const stylesDir = resolve(nuxt.options.rootDir, 'node_modules/.cache/vuetify-nuxt-module/styles') |
| 51 | + const cacheDir = join(stylesDir, hash) |
| 52 | + ctx.stylesCachePath = cacheDir |
| 53 | + |
| 54 | + // Cleanup old caches |
| 55 | + if (existsSync(stylesDir)) { |
| 56 | + const dirents = readdirSync(stylesDir, { withFileTypes: true }) |
| 57 | + for (const dirent of dirents) { |
| 58 | + if (dirent.isDirectory() && dirent.name !== hash) { |
| 59 | + rmSync(join(stylesDir, dirent.name), { recursive: true, force: true }) |
| 60 | + } |
| 61 | + } |
| 62 | + } |
| 63 | + |
| 64 | + if (existsSync(cacheDir)) { |
| 65 | + return |
| 66 | + } |
| 67 | + |
| 68 | + ctx.logger.info('Compiling Vuetify styles...') |
| 69 | + |
| 70 | + // Load SASS compiler |
| 71 | + let sass: any |
| 72 | + try { |
| 73 | + sass = await import('sass') |
| 74 | + } catch { |
| 75 | + try { |
| 76 | + sass = await import('sass-embedded') |
| 77 | + } catch { |
| 78 | + ctx.logger.warn('Could not load "sass" or "sass-embedded". Skipping styles pre-compilation.') |
| 79 | + return |
| 80 | + } |
| 81 | + } |
| 82 | + |
| 83 | + // Generate cache |
| 84 | + const files: string[] = [] |
| 85 | + findCssFiles(join(vuetifyBase, 'lib/components'), files) |
| 86 | + findCssFiles(join(vuetifyBase, 'lib/styles'), files) |
| 87 | + |
| 88 | + for (const file of files) { |
| 89 | + const relativePath = relative(vuetifyBase, file) |
| 90 | + const cacheFile = join(cacheDir, relativePath) // .css |
| 91 | + |
| 92 | + // Check if .sass or .scss exists |
| 93 | + const sassFile = file.replace(/\.css$/, '.sass') |
| 94 | + const scssFile = file.replace(/\.css$/, '.scss') |
| 95 | + |
| 96 | + let targetFile: string | undefined |
| 97 | + if (existsSync(sassFile)) { |
| 98 | + targetFile = sassFile |
| 99 | + } else if (existsSync(scssFile)) { |
| 100 | + targetFile = scssFile |
| 101 | + } |
| 102 | + |
| 103 | + if (targetFile) { |
| 104 | + const dir = dirname(cacheFile) |
| 105 | + if (!existsSync(dir)) { |
| 106 | + mkdirSync(dir, { recursive: true }) |
| 107 | + } |
| 108 | + |
| 109 | + const content = `@use "${normalizePath(configFile)}";\n@use "${normalizePath(targetFile)}";\n` |
| 110 | + |
| 111 | + try { |
| 112 | + const result = sass.compileString(content, { |
| 113 | + loadPaths: [ |
| 114 | + dirname(configFile), |
| 115 | + dirname(targetFile), |
| 116 | + resolve(vuetifyBase, '..'), |
| 117 | + resolve(vuetifyBase, '../..'), // In case of monorepo/hoisting issues, but standard is enough |
| 118 | + vuetifyBase, |
| 119 | + ], |
| 120 | + url: new URL(pathToFileURL(cacheFile).href), |
| 121 | + }) |
| 122 | + writeFileSync(cacheFile, result.css, 'utf8') |
| 123 | + } catch (error) { |
| 124 | + ctx.logger.error(`Failed to compile ${targetFile}:`, error) |
| 125 | + } |
| 126 | + } |
| 127 | + } |
| 128 | + |
| 129 | + // Create metadata.json |
| 130 | + const metadata = { |
| 131 | + hash, |
| 132 | + vuetifyVersion: ctx.vuetifyVersion, |
| 133 | + viteVersion: ctx.viteVersion, |
| 134 | + configFile, |
| 135 | + createdAt: new Date().toISOString(), |
| 136 | + } |
| 137 | + writeFileSync(join(cacheDir, 'metadata.json'), JSON.stringify(metadata, null, 2), 'utf8') |
| 138 | +} |
| 139 | + |
| 140 | +function findCssFiles (dir: string, fileList: string[] = []) { |
| 141 | + if (!existsSync(dir)) { |
| 142 | + return fileList |
| 143 | + } |
| 144 | + const files = readdirSync(dir) |
| 145 | + for (const file of files) { |
| 146 | + const filePath = join(dir, file) |
| 147 | + const stat = statSync(filePath) |
| 148 | + if (stat.isDirectory()) { |
| 149 | + findCssFiles(filePath, fileList) |
| 150 | + } else { |
| 151 | + if (file.endsWith('.css')) { |
| 152 | + fileList.push(filePath) |
| 153 | + } |
| 154 | + } |
| 155 | + } |
| 156 | + return fileList |
| 157 | +} |
0 commit comments