Fix plugin usage in build watch mode [publish]

CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+## 0.7.2
+
+- Fix plugin usage in build watch mode
+
 ## 0.7.1
 
 - Sort defaults to get a stable output

README.md

@@ -112,7 +112,7 @@ export const config: DownwindConfig = {
 
 ### Arbitrary values
 
-The implementation would work most of the time, but some shortcuts have been made to keep the implementation lean and fast:
+Few complex cases are not implemented to keep the implementation lean and fast:
 
 - `backgroundImage`, `backgroundPosition` and `fontFamily` are not supported
 - For prefix with collision (divide, border, bg, gradient steps, stroke, text, decoration, outline, ring, ring-offset), if the value doesn't match a CSS color (hex, rgb\[a], hsl\[a]) or a CSS variable it's interpreted as the "size" version. Using data types is not supported
@@ -155,7 +155,7 @@ export const config: DownwindConfig = {
 
 `max-<screen>` is supported when the screens config is a basic `min-width` only. No sorting is done.
 
-It means `min-*`, `data-*`, `aria-*`, `group-*`, `peer-*` are **not** supported.
+Other dynamic variants are not implemented for now. It means `min-*`, `data-*`, `aria-*`, `group-*`, `peer-*` are **not** supported.
 
 Punctual need usage can be accomplished using arbitrary variants: `[@media(min-width:900px)]:block`
 
@@ -275,6 +275,6 @@ Then an object with few methods is returned:
         - else if ends with `]`, parse the left as arbitrary value
     - else search for `/`, parse search for the left in the static rules map and parse the end as a modifier
 
-If the token matches a rule and is new it's added to an internal map structure by media queries. `true` is returned and this can be used to invalidate utils in developments.
+If the token matches a rule and is new it's added to an internal map structured by media queries. `true` is returned and this can be used to invalidate utils in developments.
 
 - `generate` is used to transform the recursive map into a CSS output. This is returned as the content of `virtual:@downwind/utils.css` in plugins.

package.json

@@ -3,7 +3,7 @@
   "description": "A bundler-first & PostCSS-independent implementation of Tailwind",
   "private": true,
   "type": "module",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "author": "Arnaud Barré (https://github.com/ArnaudBarre)",
   "license": "MIT",
   "scripts": {

src/esbuildPlugin.ts

@@ -50,6 +50,11 @@ const esbuildPlugin: typeof declaration = ({
     );
 
     // CSS files
+    build.onStart(() => {
+      hasBase = false;
+      hasUtils = false;
+      utilsIntervalCheck.reset();
+    });
     build.onLoad({ filter: /\.css$/ }, ({ path }) => {
       utilsIntervalCheck.taskRunning();
       return {

src/utils/intervalCheck.ts

@@ -3,6 +3,11 @@ export const intervalCheck = <T>(ms: number, getValue: () => T) => {
   let scanHappenedOnce = false;
   let scanHappened = false;
   return {
+    reset: () => {
+      utilsResolved = false;
+      scanHappenedOnce = false;
+      scanHappened = false;
+    },
     promise: new Promise<T>((resolve) => {
       const intervalId = setInterval(() => {
         if (!scanHappenedOnce) return;

src/vitePlugin.ts

@@ -166,6 +166,11 @@ const vitePlugin: typeof declaration = ({
       enforce: "pre",
       configResolved,
       resolveId,
+      buildStart() {
+        hasBase = false;
+        hasUtils = false;
+        utilsIntervalCheck.reset();
+      },
       load(id) {
         if (id === baseModuleId) return downwind.getBase();
         if (id === utilsModuleId) return utilsIntervalCheck.promise;