@pikacss/unplugin-pikacss 0.0.49 → 0.0.51

package/README.md

@@ -36,7 +36,7 @@ import pikacss from '@pikacss/unplugin-pikacss/webpack'
 
 ## Documentation
 
-See the [full documentation](https://pikacss.com/guide/integrations/vite).
+See the [full documentation](https://pikacss.com/integrations/unplugin).
 
 ## License
 

package/dist/index.d.mts

@@ -15,6 +15,9 @@ export * from "@pikacss/integration";
  * This is the core entry-point called by `createUnplugin`. It resolves user options,
  * creates an integration context via `createCtx`, and wires bundler-specific lifecycle
  * hooks (config resolution, dev-server HMR, build transforms, and config file watching).
+ * When consumed through the Vite entry, the plugin also declares `enforce: 'pre'`
+ * so PikaCSS transforms run before framework compiler plugins even if the user's
+ * Vite `plugins` array lists `vue()` before `pikacss()`.
  *
  * @example
  * ```ts

package/dist/index.mjs

@@ -19,6 +19,9 @@ const PLUGIN_NAME = "unplugin-pikacss";
 * This is the core entry-point called by `createUnplugin`. It resolves user options,
 * creates an integration context via `createCtx`, and wires bundler-specific lifecycle
 * hooks (config resolution, dev-server HMR, build transforms, and config file watching).
+* When consumed through the Vite entry, the plugin also declares `enforce: 'pre'`
+* so PikaCSS transforms run before framework compiler plugins even if the user's
+* Vite `plugins` array lists `vue()` before `pikacss()`.
 *
 * @example
 * ```ts
@@ -62,17 +65,52 @@ const unpluginFactory = (options, meta) => {
 	const debouncedWriteTsCodegenFile = debounce(async () => {
 		await ctx.writeTsCodegenFile();
 	}, 300);
+	let activeTransforms = 0;
+	let pendingCssWrite = false;
+	let pendingTsWrite = false;
+	let generatedWritePromise = Promise.resolve();
+	function flushPendingGeneratedWrites() {
+		generatedWritePromise = generatedWritePromise.catch(() => {}).then(async () => {
+			if (activeTransforms > 0) return;
+			const shouldWriteCss = pendingCssWrite;
+			const shouldWriteTs = pendingTsWrite;
+			pendingCssWrite = false;
+			pendingTsWrite = false;
+			if (shouldWriteCss) try {
+				await debouncedWriteCssCodegenFile();
+			} catch (error) {
+				pendingCssWrite = true;
+				if (shouldWriteTs) pendingTsWrite = true;
+				throw error;
+			}
+			if (shouldWriteTs) try {
+				await debouncedWriteTsCodegenFile();
+			} catch (error) {
+				pendingTsWrite = true;
+				throw error;
+			}
+		});
+		return generatedWritePromise;
+	}
+	function queueCssWrite() {
+		pendingCssWrite = true;
+		return flushPendingGeneratedWrites();
+	}
+	function queueTsWrite() {
+		pendingTsWrite = true;
+		return flushPendingGeneratedWrites();
+	}
 	let hooksBound = false;
 	function bindHooks() {
 		if (hooksBound) return;
 		hooksBound = true;
 		ctx.hooks.styleUpdated.on(() => {
 			log.debug(`Style updated, ${ctx.engine.store.atomicStyleIds.size} atomic styles generated`);
-			debouncedWriteCssCodegenFile();
+			return queueCssWrite();
 		});
 		ctx.hooks.tsCodegenUpdated.on(() => {
 			log.debug("TypeScript code generation updated");
-			debouncedWriteTsCodegenFile();
+			return queueTsWrite();
 		});
 	}
 	let setupPromise = Promise.resolve();
@@ -83,6 +121,9 @@ const unpluginFactory = (options, meta) => {
 		setupPromise = setupPromise.then(async () => {
 			log.debug("Setting up integration context...");
 			const moduleIds = Array.from(ctx.usages.keys());
+			activeTransforms = 0;
+			pendingCssWrite = false;
+			pendingTsWrite = false;
 			hooksBound = false;
 			await ctx.setup();
 			lastSetupCwd = ctx.cwd;
@@ -121,6 +162,7 @@ const unpluginFactory = (options, meta) => {
 	const debouncedSetup = debounce(setup);
 	return {
 		name: PLUGIN_NAME,
+		enforce: "pre",
 		vite: {
 			configResolved: (config) => {
 				applyRuntimeContext(config.root, config.command === "serve" ? "serve" : "build");
@@ -173,11 +215,17 @@ const unpluginFactory = (options, meta) => {
 			} },
 			async handler(code, id) {
 				await ensureSetup();
+				activeTransforms++;
 				if (meta.framework === "webpack" && ctx.resolvedConfigPath != null) {
 					this.addWatchFile(ctx.resolvedConfigPath);
 					log.debug(`Added watch file: ${ctx.resolvedConfigPath}`);
 				}
-				return ctx.transform(code, id);
+				try {
+					return await ctx.transform(code, id);
+				} finally {
+					if (activeTransforms > 0) activeTransforms--;
+					if (activeTransforms === 0) await flushPendingGeneratedWrites();
+				}
 			}
 		},
 		watchChange(id) {

package/dist/vite.d.mts

@@ -9,6 +9,8 @@ export * from "@pikacss/integration";
  * Wraps the shared PikaCSS unplugin factory into a Vite-compatible plugin.
  * Accepts optional {@link PluginOptions} to configure scanning, code
  * generation, and engine settings. Returns a standard Vite `Plugin`.
+ * The plugin declares `enforce: 'pre'`, so PikaCSS template transforms run
+ * before framework compiler plugins regardless of the user's `plugins` order.
  *
  * @example
  * ```ts

package/dist/vite.mjs

@@ -8,6 +8,8 @@ export * from "@pikacss/integration";
 * Wraps the shared PikaCSS unplugin factory into a Vite-compatible plugin.
 * Accepts optional {@link PluginOptions} to configure scanning, code
 * generation, and engine settings. Returns a standard Vite `Plugin`.
+* The plugin declares `enforce: 'pre'`, so PikaCSS template transforms run
+* before framework compiler plugins regardless of the user's `plugins` order.
 *
 * @example
 * ```ts

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pikacss/unplugin-pikacss",
   "type": "module",
-  "version": "0.0.49",
+  "version": "0.0.51",
   "author": "DevilTea <ch19980814@gmail.com>",
   "license": "MIT",
   "homepage": "https://pikacss.com",
@@ -94,7 +94,7 @@
     "pathe": "^2.0.3",
     "perfect-debounce": "^2.1.0",
     "unplugin": "^3.0.0",
-    "@pikacss/integration": "0.0.49"
+    "@pikacss/integration": "0.0.51"
   },
   "devDependencies": {
     "esbuild": "^0.27.4",