auklet 0.2.10 → 0.3.0

package/dist/css/vite/hmr.d.ts

@@ -1,17 +1,32 @@
 import type { HotUpdateOptions, ViteDevServer } from 'vite';
 import type { ModuleStyleGraph } from '#auklet/css/vite/moduleGraph/graph';
+export type AukletStyleHmrOptions = {
+    pruneDelayMs?: number;
+};
 export declare class AukletStyleHmr {
     private readonly graph;
     private readonly lastUpdateTimes;
     private suppressFullReloadUntil;
     private readonly virtualIdsByDependency;
-    constructor(graph: () => ModuleStyleGraph);
+    private readonly filesByVirtualId;
+    private readonly schedulePruneStaleVirtualDependencies;
+    private readonly pruneDelayMs;
+    constructor(graph: () => ModuleStyleGraph, options?: AukletStyleHmrOptions);
     trackVirtualStyleDependency(file: string, virtualId: string): void;
-    hasTrackedStyleDependency(file: string): boolean;
+    replaceVirtualStyleDependency(virtualId: string, files: Array<string>): void;
+    hasTrackedStyleDependency(file: string, moduleGraph?: Pick<ViteDevServer['moduleGraph'], 'getModuleById'>): boolean;
+    pruneStaleVirtualDependencies(moduleGraph: Pick<ViteDevServer['moduleGraph'], 'getModuleById'>): void;
+    scheduleStaleVirtualDependencyPrune(moduleGraph: Pick<ViteDevServer['moduleGraph'], 'getModuleById'>): void;
+    cancelStaleVirtualDependencyPrune(): void;
     installFullReloadGuard(server: Pick<ViteDevServer, 'ws'>): void;
-    handleStyleHotUpdate(context: HotUpdateOptions): never[] | undefined;
-    handleSourceModuleChange(server: Pick<ViteDevServer, 'moduleGraph' | 'ws'>, file: string): boolean;
+    handleStyleHotUpdate(context: HotUpdateOptions): Promise<never[] | undefined>;
+    handleSourceModuleChange(server: Pick<ViteDevServer, 'moduleGraph' | 'ws'>, file: string): Promise<boolean>;
     private sendVirtualStyleUpdates;
+    private parseTrackedVirtualIds;
+    private getDependencyVirtualIds;
+    private parseTrackedVirtualId;
+    private createTrackedVirtualStyleResults;
+    private refreshSourceModuleUpdates;
     private suppressFullReload;
     private shouldSuppressFullReload;
     private isDuplicateUpdate;

package/dist/css/vite/hmr.js

@@ -1,9 +1,10 @@
 import path from 'node:path';
-import { isString } from 'aidly';
+import { isString, throttle } from 'aidly';
 import { normalizeFileKey } from '#auklet/utils';
 import { createAukletLogger } from '#auklet/logger';
 const FULL_RELOAD_SUPPRESS_MS = 100;
 const DUPLICATE_UPDATE_IGNORE_MS = 500;
+const RESOLVED_VIRTUAL_ID_PREFIX = '\0auklet-css:';
 const logger = createAukletLogger({ scope: 'css:vite' });
 const toBrowserVirtualPath = (id) => {
     return `/@id/${id.replace('\0', '__x00__')}`;
@@ -11,20 +12,39 @@ const toBrowserVirtualPath = (id) => {
 const getRelativeFile = (file) => {
     return path.relative(process.cwd(), file);
 };
-const addVirtualStyleDependency = (virtualIdsByDependency, file, virtualId) => {
+const addVirtualStyleDependency = (virtualIdsByDependency, filesByVirtualId, file, virtualId) => {
     const normalizedFile = normalizeFileKey(file);
     const values = virtualIdsByDependency.get(normalizedFile) ?? new Set();
     values.add(virtualId);
     virtualIdsByDependency.set(normalizedFile, values);
+    const files = filesByVirtualId.get(virtualId) ?? new Set();
+    files.add(normalizedFile);
+    filesByVirtualId.set(virtualId, files);
 };
-const getDependencyVirtualIds = (virtualIdsByDependency, file) => {
-    return Array.from(virtualIdsByDependency.get(normalizeFileKey(file)) ?? []);
+const removeVirtualStyleDependency = (virtualIdsByDependency, filesByVirtualId, file, virtualId) => {
+    const normalizedFile = normalizeFileKey(file);
+    const values = virtualIdsByDependency.get(normalizedFile);
+    if (values) {
+        values.delete(virtualId);
+        if (!values.size) {
+            virtualIdsByDependency.delete(normalizedFile);
+        }
+    }
+    const files = filesByVirtualId.get(virtualId);
+    if (files) {
+        files.delete(normalizedFile);
+        if (!files.size) {
+            filesByVirtualId.delete(virtualId);
+        }
+    }
 };
-const getDependencyVirtualModules = (virtualIdsByDependency, server, file) => {
-    return getDependencyVirtualIds(virtualIdsByDependency, file).flatMap((id) => {
-        const module = server.moduleGraph.getModuleById(id);
-        return module ? [module] : [];
-    });
+const sameStringSets = (left, right) => {
+    if (left.length !== right.length)
+        return false;
+    const rightSet = new Set(right);
+    if (rightSet.size !== left.length)
+        return false;
+    return left.every((item) => rightSet.has(item));
 };
 const createJsUpdates = (virtualIds, timestamp) => {
     return virtualIds.map((id) => {
@@ -44,14 +64,46 @@ export class AukletStyleHmr {
     lastUpdateTimes = new Map();
     suppressFullReloadUntil = 0;
     virtualIdsByDependency = new Map();
-    constructor(graph) {
+    filesByVirtualId = new Map();
+    schedulePruneStaleVirtualDependencies;
+    pruneDelayMs;
+    constructor(graph, options = {}) {
         this.graph = graph;
+        this.pruneDelayMs = options.pruneDelayMs ?? 2 * 60 * 1000;
+        this.schedulePruneStaleVirtualDependencies = throttle(this.pruneDelayMs, (moduleGraph) => this.pruneStaleVirtualDependencies(moduleGraph));
     }
     trackVirtualStyleDependency(file, virtualId) {
-        addVirtualStyleDependency(this.virtualIdsByDependency, file, virtualId);
+        addVirtualStyleDependency(this.virtualIdsByDependency, this.filesByVirtualId, file, virtualId);
+    }
+    replaceVirtualStyleDependency(virtualId, files) {
+        const normalizedFiles = new Set(files.map((file) => normalizeFileKey(file)));
+        const previousFiles = this.filesByVirtualId.get(virtualId) ?? new Set();
+        for (const file of previousFiles) {
+            if (normalizedFiles.has(file))
+                continue;
+            removeVirtualStyleDependency(this.virtualIdsByDependency, this.filesByVirtualId, file, virtualId);
+        }
+        for (const file of normalizedFiles) {
+            addVirtualStyleDependency(this.virtualIdsByDependency, this.filesByVirtualId, file, virtualId);
+        }
+    }
+    hasTrackedStyleDependency(file, moduleGraph) {
+        return this.getDependencyVirtualIds(file, moduleGraph).length > 0;
+    }
+    pruneStaleVirtualDependencies(moduleGraph) {
+        for (const [normalizedFile, virtualIds] of this.virtualIdsByDependency) {
+            for (const virtualId of Array.from(virtualIds)) {
+                if (moduleGraph.getModuleById(virtualId))
+                    continue;
+                removeVirtualStyleDependency(this.virtualIdsByDependency, this.filesByVirtualId, normalizedFile, virtualId);
+            }
+        }
+    }
+    scheduleStaleVirtualDependencyPrune(moduleGraph) {
+        this.schedulePruneStaleVirtualDependencies(moduleGraph);
     }
-    hasTrackedStyleDependency(file) {
-        return (getDependencyVirtualIds(this.virtualIdsByDependency, file).length > 0);
+    cancelStaleVirtualDependencyPrune() {
+        this.schedulePruneStaleVirtualDependencies.cancel();
     }
     installFullReloadGuard(server) {
         const send = server.ws.send.bind(server.ws);
@@ -69,7 +121,7 @@ export class AukletStyleHmr {
             send(payload);
         });
     }
-    handleStyleHotUpdate(context) {
+    async handleStyleHotUpdate(context) {
         const graph = this.graph();
         if (!graph.isSourceGraphFile(context.file) ||
             !graph.isStyleFile(context.file)) {
@@ -81,24 +133,43 @@ export class AukletStyleHmr {
             return [];
         }
         const updates = this.sendVirtualStyleUpdates(context.file, context.server, context.timestamp);
+        if (!updates.sent) {
+            return [];
+        }
         logger.info(`package css hmr ${getRelativeFile(context.file)} tracked=${updates.tracked} updates=${updates.sent}`);
         return [];
     }
-    handleSourceModuleChange(server, file) {
+    async handleSourceModuleChange(server, file) {
         const graph = this.graph();
         if (!graph.isSourceGraphFile(file) || !graph.isSourceModuleFile(file)) {
             return false;
         }
+        const virtualIds = this.getDependencyVirtualIds(file, server.moduleGraph);
+        if (!virtualIds.length) {
+            graph.invalidateFile(file);
+            return false;
+        }
+        const parsedVirtualIds = this.parseTrackedVirtualIds(graph, virtualIds);
+        if (!parsedVirtualIds.length) {
+            graph.invalidateFile(file);
+            return false;
+        }
+        const previousResults = this.createTrackedVirtualStyleResults(graph, parsedVirtualIds);
         graph.invalidateFile(file);
-        const updates = this.sendVirtualStyleUpdates(file, server, Date.now());
+        const updates = await this.refreshSourceModuleUpdates(server, parsedVirtualIds, previousResults);
+        if (!updates.sent) {
+            return false;
+        }
         logger.info(`package css source hmr ${getRelativeFile(file)} tracked=${updates.tracked} updates=${updates.sent}`);
-        return true;
+        return updates.sent > 0;
     }
     sendVirtualStyleUpdates(file, server, timestamp) {
-        const virtualIds = getDependencyVirtualIds(this.virtualIdsByDependency, file);
-        const modules = getDependencyVirtualModules(this.virtualIdsByDependency, server, file);
-        for (const module of modules) {
-            server.moduleGraph.invalidateModule(module);
+        const virtualIds = this.getDependencyVirtualIds(file, server.moduleGraph);
+        for (const id of virtualIds) {
+            const module = server.moduleGraph.getModuleById(id);
+            if (module) {
+                server.moduleGraph.invalidateModule(module);
+            }
         }
         const updates = createJsUpdates(virtualIds, timestamp);
         if (updates.length) {
@@ -112,6 +183,76 @@ export class AukletStyleHmr {
             tracked: virtualIds.length,
         };
     }
+    parseTrackedVirtualIds(graph, virtualIds) {
+        return virtualIds
+            .map((id) => this.parseTrackedVirtualId(graph, id))
+            .filter((item) => Boolean(item));
+    }
+    getDependencyVirtualIds(file, moduleGraph) {
+        const normalizedFile = normalizeFileKey(file);
+        const virtualIds = Array.from(this.virtualIdsByDependency.get(normalizedFile) ?? []);
+        if (!moduleGraph) {
+            return virtualIds;
+        }
+        const liveVirtualIds = virtualIds.filter((virtualId) => moduleGraph.getModuleById(virtualId));
+        if (liveVirtualIds.length !== virtualIds.length) {
+            const liveSet = new Set(liveVirtualIds);
+            for (const virtualId of virtualIds) {
+                if (liveSet.has(virtualId))
+                    continue;
+                removeVirtualStyleDependency(this.virtualIdsByDependency, this.filesByVirtualId, normalizedFile, virtualId);
+            }
+        }
+        return liveVirtualIds;
+    }
+    parseTrackedVirtualId(graph, id) {
+        const parsedId = id.startsWith(RESOLVED_VIRTUAL_ID_PREFIX)
+            ? id.slice(RESOLVED_VIRTUAL_ID_PREFIX.length)
+            : id;
+        const parsed = graph.parsePackageStyleId(parsedId);
+        if (!parsed || !graph.getPackageNames().includes(parsed.packageName)) {
+            return null;
+        }
+        return {
+            id,
+            parsed,
+        };
+    }
+    createTrackedVirtualStyleResults(graph, parsedVirtualIds) {
+        const previousResults = new Map();
+        for (const item of parsedVirtualIds) {
+            previousResults.set(item.id, graph.peekPackageStyleCode(item.parsed));
+        }
+        return previousResults;
+    }
+    async refreshSourceModuleUpdates(server, parsedVirtualIds, previousResults) {
+        const graph = this.graph();
+        const changedVirtualIds = [];
+        for (const item of parsedVirtualIds) {
+            const nextResult = await graph.createPackageStyleCode(item.parsed);
+            const previousResult = previousResults.get(item.id);
+            if (!previousResult ||
+                previousResult.code !== nextResult.code ||
+                !sameStringSets(previousResult.watchFiles, nextResult.watchFiles)) {
+                changedVirtualIds.push(item.id);
+                const module = server.moduleGraph.getModuleById(item.id);
+                if (module) {
+                    server.moduleGraph.invalidateModule(module);
+                }
+            }
+        }
+        const updates = createJsUpdates(changedVirtualIds, Date.now());
+        if (updates.length) {
+            server.ws.send({
+                type: 'update',
+                updates,
+            });
+        }
+        return {
+            sent: updates.length,
+            tracked: parsedVirtualIds.length,
+        };
+    }
     suppressFullReload() {
         this.suppressFullReloadUntil = Date.now() + FULL_RELOAD_SUPPRESS_MS;
     }

package/dist/css/vite/moduleGraph/graph.d.ts

@@ -16,6 +16,7 @@ export declare class ModuleStyleGraph {
     getPackageNames(): string[];
     getWatchRoots(): Promise<string[]>;
     createPackageStyleCode(parsed: PackageStyleId): Promise<import("#auklet/css/vite/moduleGraph/types").PackageStyleLoadResult>;
+    peekPackageStyleCode(parsed: PackageStyleId): import("#auklet/css/vite/moduleGraph/types").PackageStyleLoadResult | null;
     invalidatePackage(packageName: string): void;
     invalidateFile(file: string): string | null;
     isSourceModuleFile(file: string): boolean;

package/dist/css/vite/moduleGraph/graph.js

@@ -60,6 +60,9 @@ export class ModuleStyleGraph {
     createPackageStyleCode(parsed) {
         return this.styleCodeFactory.createPackageStyleCode(parsed, this.requestCache);
     }
+    peekPackageStyleCode(parsed) {
+        return this.requestCache.peekLoadResult(parsed);
+    }
     invalidatePackage(packageName) {
         this.requestCache.invalidatePackage(packageName);
     }

package/dist/css/vite/moduleGraph/persistentCache.d.ts

@@ -1,10 +1,12 @@
 import type { PackageStyleLoadResult } from '#auklet/css/vite/moduleGraph/types';
 export type PersistentStyleGraphCacheOptions = {
     root: string;
+    maxCacheFiles?: number;
 };
 export declare class PersistentStyleGraphCache {
-    private static readonly cleanedRoots;
+    private static readonly lastCleanupTimes;
     private readonly cacheRoot;
+    private readonly maxCacheFiles;
     constructor(options: PersistentStyleGraphCacheOptions);
     createKey(value: unknown): string;
     read(key: string): PackageStyleLoadResult | null;

package/dist/css/vite/moduleGraph/persistentCache.js

@@ -4,6 +4,7 @@ import crypto from 'node:crypto';
 import { toPosixPath } from '#auklet/utils';
 const cacheVersion = 'v1';
 const maxCacheFiles = 5000;
+const cleanupIntervalMs = 5 * 60 * 1000;
 const staleCacheAgeMs = 7 * 24 * 60 * 60 * 1000;
 const stableStringify = (value) => {
     if (Array.isArray(value)) {
@@ -68,10 +69,12 @@ const statCachedFile = (file) => {
     };
 };
 export class PersistentStyleGraphCache {
-    static cleanedRoots = new Set();
+    static lastCleanupTimes = new Map();
     cacheRoot;
+    maxCacheFiles;
     constructor(options) {
         this.cacheRoot = path.join(options.root, 'node_modules', '.auklet', 'cache', 'vite-style', cacheVersion);
+        this.maxCacheFiles = options.maxCacheFiles ?? maxCacheFiles;
     }
     createKey(value) {
         return hashValue({
@@ -96,10 +99,10 @@ export class PersistentStyleGraphCache {
         }
     }
     write(key, result, inputFiles) {
-        const files = Array.from(new Map(inputFiles
-            .map((file) => statCachedFile(file))
-            .map((file) => [file.file, file])).values());
         try {
+            const files = Array.from(new Map(inputFiles
+                .map((file) => statCachedFile(file))
+                .map((file) => [file.file, file])).values());
             fs.mkdirSync(this.cacheRoot, { recursive: true });
             fs.writeFileSync(this.getCacheFile(key), `${JSON.stringify({
                 files,
@@ -114,11 +117,12 @@ export class PersistentStyleGraphCache {
         this.cleanupStaleEntries();
     }
     cleanupStaleEntries() {
-        if (PersistentStyleGraphCache.cleanedRoots.has(this.cacheRoot))
+        const now = Date.now();
+        const lastCleanupTime = PersistentStyleGraphCache.lastCleanupTimes.get(this.cacheRoot) ?? 0;
+        if (now - lastCleanupTime < cleanupIntervalMs)
             return;
-        PersistentStyleGraphCache.cleanedRoots.add(this.cacheRoot);
+        PersistentStyleGraphCache.lastCleanupTimes.set(this.cacheRoot, now);
         try {
-            const now = Date.now();
             const entries = fs
                 .readdirSync(this.cacheRoot, { withFileTypes: true })
                 .filter((entry) => entry.isFile() && entry.name.endsWith('.json'))
@@ -137,7 +141,7 @@ export class PersistentStyleGraphCache {
                 }
                 freshEntries.push(entry);
             }
-            const overflowCount = freshEntries.length - maxCacheFiles;
+            const overflowCount = freshEntries.length - this.maxCacheFiles;
             if (overflowCount <= 0)
                 return;
             for (const entry of freshEntries

package/dist/css/vite/moduleGraph/requestCache.d.ts

@@ -4,6 +4,10 @@ import type { StyleProcessor } from '#auklet/css/core/styleProcessor';
 import type { WorkspaceStyleResolver } from '#auklet/css/core/workspaceStyleResolver';
 import type { StylePackageSource } from '#auklet/css/vite/moduleGraph/packageSource/types';
 import type { LoadAukletConfig, PackageStyleId, PackageStyleLoadResult } from '#auklet/css/vite/moduleGraph/types';
+type LoadResultEntry = {
+    commit?: () => PackageStyleLoadResult;
+    result: PackageStyleLoadResult;
+};
 export type PackageStyleContext = {
     normalizedConfig: NormalizedAukletConfig;
     context: ResolvedModuleStyleBuildContext;
@@ -25,9 +29,12 @@ export declare class ModuleStyleGraphRequestCache {
     private readonly options;
     private readonly contexts;
     private readonly loadResults;
+    private readonly settledLoadResults;
     private readonly loadResultDependencies;
+    private readonly loadResultVersions;
     private readonly loadAukletConfig;
     private readonly persistentCache;
+    private graphVersion;
     constructor(options: ModuleStyleGraphRequestCacheOptions);
     getPackageNames(): string[];
     isKnownPackageName(packageName: string): boolean;
@@ -68,7 +75,7 @@ export declare class ModuleStyleGraphRequestCache {
         sourceRoot: string;
         styleProcessor: StyleProcessor;
     } | null>;
-    getLoadResult(parsed: PackageStyleId, create: () => Promise<PackageStyleLoadResult>): Promise<PackageStyleLoadResult>;
+    getLoadResult(parsed: PackageStyleId, create: () => Promise<LoadResultEntry>): Promise<PackageStyleLoadResult>;
     invalidatePackage(packageName: string): void;
     readPersistentLoadResult(parsed: PackageStyleId, context: PackageStyleContext): PackageStyleLoadResult | null;
     writePersistentLoadResult(parsed: PackageStyleId, context: PackageStyleContext, result: PackageStyleLoadResult): {
@@ -87,4 +94,10 @@ export declare class ModuleStyleGraphRequestCache {
     private getLoadResultKey;
     private getLoadResultPackageName;
     private invalidateLoadResults;
+    private discardLoadResult;
+    peekLoadResult(parsed: PackageStyleId): PackageStyleLoadResult | null;
+    private getGraphVersion;
+    private bumpGraphVersion;
+    private bumpLoadResultVersion;
 }
+export {};

package/dist/css/vite/moduleGraph/requestCache.js

@@ -8,9 +8,12 @@ export class ModuleStyleGraphRequestCache {
     options;
     contexts = new Map();
     loadResults = new Map();
+    settledLoadResults = new Map();
     loadResultDependencies = new Map();
+    loadResultVersions = new Map();
     loadAukletConfig;
     persistentCache;
+    graphVersion = 0;
     constructor(options) {
         this.options = options;
         this.loadAukletConfig = options.loadAukletConfig ?? loadAukletConfig;
@@ -37,14 +40,53 @@ export class ModuleStyleGraphRequestCache {
         const cachedResult = this.loadResults.get(key);
         if (cachedResult)
             return cachedResult;
-        const result = create().then((value) => {
-            this.loadResultDependencies.set(key, new Set(value.dependencyPackages ?? []));
-            return value;
+        const version = this.bumpLoadResultVersion(key);
+        const graphVersion = this.getGraphVersion();
+        let result;
+        result = create()
+            .then(async (entry) => {
+            if (this.getGraphVersion() !== graphVersion) {
+                const currentResult = this.loadResults.get(key);
+                if (currentResult && currentResult !== result) {
+                    return currentResult;
+                }
+                this.discardLoadResult(key);
+                return this.getLoadResult(parsed, create);
+            }
+            if (this.loadResultVersions.get(key) === version) {
+                this.loadResultDependencies.set(key, new Set(entry.result.dependencyPackages ?? []));
+            }
+            try {
+                const committedResult = entry.commit?.();
+                if (committedResult) {
+                    entry.result = committedResult;
+                }
+            }
+            catch {
+                // Persistent cache writes are best-effort and must not fail dev CSS.
+            }
+            this.settledLoadResults.set(key, entry.result);
+            return entry.result;
+        })
+            .catch((error) => {
+            if (this.getGraphVersion() !== graphVersion) {
+                const currentResult = this.loadResults.get(key);
+                if (currentResult && currentResult !== result) {
+                    return currentResult;
+                }
+                this.discardLoadResult(key);
+                return this.getLoadResult(parsed, create);
+            }
+            if (this.loadResultVersions.get(key) === version) {
+                this.discardLoadResult(key);
+            }
+            throw error;
         });
         this.loadResults.set(key, result);
         return result;
     }
     invalidatePackage(packageName) {
+        this.bumpGraphVersion();
         this.contexts.delete(packageName);
         this.invalidateLoadResults(packageName);
     }
@@ -208,8 +250,29 @@ export class ModuleStyleGraphRequestCache {
                     continue;
                 }
             }
-            this.loadResults.delete(key);
-            this.loadResultDependencies.delete(key);
+            this.discardLoadResult(key);
         }
     }
+    discardLoadResult(key) {
+        this.bumpGraphVersion();
+        this.bumpLoadResultVersion(key);
+        this.loadResults.delete(key);
+        this.loadResultDependencies.delete(key);
+        this.settledLoadResults.delete(key);
+    }
+    peekLoadResult(parsed) {
+        return this.settledLoadResults.get(this.getLoadResultKey(parsed)) ?? null;
+    }
+    getGraphVersion() {
+        return this.graphVersion;
+    }
+    bumpGraphVersion() {
+        this.graphVersion += 1;
+        return this.graphVersion;
+    }
+    bumpLoadResultVersion(key) {
+        const nextVersion = (this.loadResultVersions.get(key) ?? 0) + 1;
+        this.loadResultVersions.set(key, nextVersion);
+        return nextVersion;
+    }
 }

package/dist/css/vite/moduleGraph/styleCodeFactory.js

@@ -14,19 +14,30 @@ export class StyleCodeFactory {
         this.config = config;
     }
     async createPackageStyleCode(parsed, cache) {
-        return cache.getLoadResult(parsed, async () => this.normalizeTopLevelImports(await this.createUncachedPackageStyleCode(parsed, cache)));
-    }
-    async createUncachedPackageStyleCode(parsed, cache) {
-        const context = await cache.getContext(parsed);
-        if (!context) {
+        return cache.getLoadResult(parsed, async () => {
+            const context = await cache.getContext(parsed);
+            if (!context) {
+                return {
+                    result: {
+                        code: '',
+                        watchFiles: [],
+                    },
+                };
+            }
+            const cachedResult = cache.readPersistentLoadResult(parsed, context);
+            if (cachedResult) {
+                return {
+                    result: cachedResult,
+                };
+            }
+            const result = this.normalizeTopLevelImports(await this.createUncachedPackageStyleCode(parsed, cache, context));
             return {
-                code: '',
-                watchFiles: [],
+                result,
+                commit: () => cache.writePersistentLoadResult(parsed, context, result),
             };
-        }
-        const cachedResult = cache.readPersistentLoadResult(parsed, context);
-        if (cachedResult)
-            return cachedResult;
+        });
+    }
+    async createUncachedPackageStyleCode(parsed, cache, context) {
         let result;
         if (parsed.stylePath === STYLE_ENTRY) {
             result = await this.createStyleCode(context, cache);
@@ -45,7 +56,7 @@ export class StyleCodeFactory {
         else {
             result = await this.createSourceModuleStyleCode(context, cache, parsed.stylePath);
         }
-        return cache.writePersistentLoadResult(parsed, context, this.normalizeTopLevelImports(result));
+        return result;
     }
     async createStyleCode(context, cache) {
         const results = [];

package/dist/css/vite/vitePlugin.d.ts

@@ -15,6 +15,6 @@ export declare function aukletStylePlugin(options?: AukletStylePluginOptions): {
     configureServer(server: ViteDevServer): Promise<void>;
     hotUpdate: {
         order: "pre";
-        handler(context: HotUpdateOptions): never[] | undefined;
+        handler(context: HotUpdateOptions): Promise<never[] | undefined>;
     };
 };

package/dist/css/vite/vitePlugin.js

@@ -2,10 +2,12 @@ import fs from 'node:fs';
 import path from 'node:path';
 import { AukletStyleHmr } from '#auklet/css/vite/hmr';
 import { ModuleStyleGraph } from '#auklet/css/vite/moduleGraph/graph';
+import { createAukletLogger } from '#auklet/logger';
 const WORKSPACE_FILE = 'pnpm-workspace.yaml';
 const VIRTUAL_ID_PREFIX = 'virtual:auklet-css:';
 const RESOLVED_VIRTUAL_ID_PREFIX = '\0auklet-css:';
 const BROWSER_VIRTUAL_ID_PREFIX = 'auklet-css:';
+const logger = createAukletLogger({ scope: 'css:vite' });
 const stripQuery = (id) => id.split('?')[0];
 const toResolvedVirtualId = (id) => {
     if (id.startsWith(RESOLVED_VIRTUAL_ID_PREFIX)) {
@@ -42,6 +44,20 @@ const resolveGraphRoot = (mode, viteRoot) => {
         return findWorkspaceRoot(viteRoot) ?? process.cwd();
     return viteRoot;
 };
+const createWatcherErrorPayload = (error, file) => {
+    const err = error instanceof Error
+        ? error
+        : new Error(typeof error === 'string' ? error : String(error));
+    return {
+        type: 'error',
+        err: {
+            message: err.message,
+            stack: err.stack ?? err.message,
+            plugin: 'auklet-css',
+            id: file,
+        },
+    };
+};
 const invalidateVirtualModules = (server, graph) => {
     const modules = [];
     for (const packageName of graph.getPackageNames()) {
@@ -57,6 +73,7 @@ const invalidateVirtualModules = (server, graph) => {
 };
 export function aukletStylePlugin(options = {}) {
     let graph = null;
+    let moduleGraph = null;
     const getGraph = () => {
         if (!graph) {
             graph = createModuleStyleGraph(options, process.cwd());
@@ -93,15 +110,24 @@ export function aukletStylePlugin(options = {}) {
             if (!parsed)
                 return null;
             const result = await graph.createPackageStyleCode(parsed);
+            if (moduleGraph) {
+                hmr.pruneStaleVirtualDependencies(moduleGraph);
+            }
+            hmr.replaceVirtualStyleDependency(id, result.watchFiles);
             for (const file of result.watchFiles) {
-                hmr.trackVirtualStyleDependency(file, id);
                 this.addWatchFile?.(file);
             }
             return result.code;
         },
         async configureServer(server) {
             const graph = getGraph();
+            moduleGraph = server.moduleGraph;
             hmr.installFullReloadGuard(server);
+            const close = server.close.bind(server);
+            server.close = (async () => {
+                hmr.cancelStaleVirtualDependencyPrune();
+                return close();
+            });
             server.watcher.add(await graph.getWatchRoots());
             const invalidateStyleGraph = (file) => {
                 if (!graph.isSourceGraphFile(file))
@@ -117,23 +143,33 @@ export function aukletStylePlugin(options = {}) {
             };
             server.watcher.on('add', reloadStyleGraph);
             server.watcher.on('unlink', reloadStyleGraph);
-            server.watcher.on('change', (file) => {
-                if (graph.isStyleConfigFile(file)) {
-                    reloadStyleGraph(file);
-                }
-                else if (graph.isStyleFile(file) &&
-                    hmr.hasTrackedStyleDependency(file)) {
-                    hmr.handleStyleHotUpdate({
-                        file,
-                        modules: [],
-                        server,
-                        timestamp: Date.now(),
-                        type: 'update',
-                        read: async () => '',
-                    });
+            server.watcher.on('change', async (file) => {
+                try {
+                    hmr.scheduleStaleVirtualDependencyPrune(server.moduleGraph);
+                    if (graph.isStyleConfigFile(file)) {
+                        reloadStyleGraph(file);
+                    }
+                    else if (graph.isStyleFile(file)) {
+                        graph.invalidateFile(file);
+                        if (hmr.hasTrackedStyleDependency(file, server.moduleGraph)) {
+                            await hmr.handleStyleHotUpdate({
+                                file,
+                                modules: [],
+                                server,
+                                timestamp: Date.now(),
+                                type: 'update',
+                                read: async () => '',
+                            });
+                        }
+                    }
+                    else if (graph.isSourceModuleFile(file)) {
+                        await hmr.handleSourceModuleChange(server, file);
+                    }
                 }
-                else if (graph.isSourceModuleFile(file)) {
-                    hmr.handleSourceModuleChange(server, file);
+                catch (error) {
+                    logger.error('package css change watcher failed');
+                    logger.error(error);
+                    server.ws.send(createWatcherErrorPayload(error, file));
                 }
             });
         },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "auklet",
-  "version": "0.2.10",
+  "version": "0.3.0",
   "type": "module",
   "author": "chentao.arthur",
   "description": "Build utilities for TypeScript packages and module CSS output.",