@unocss/vite 0.48.2 → 0.48.4

package/dist/index.cjs

@@ -516,7 +516,7 @@ function GlobalModeBuildPlugin(ctx) {
 const WARN_TIMEOUT = 2e4;
 const WS_EVENT_PREFIX = "unocss:hmr";
 const HASH_LENGTH = 6;
-function GlobalModeDevPlugin({ uno, tokens, tasks, flushTasks, affectedModules, onInvalidate, extract, filter }) {
+function GlobalModeDevPlugin({ uno, tokens, tasks, flushTasks, affectedModules, onInvalidate, extract, filter, getConfig }) {
   const servers = [];
   let base = "";
   const entries = /* @__PURE__ */ new Set();
@@ -652,16 +652,24 @@ function GlobalModeDevPlugin({ uno, tokens, tasks, flushTasks, affectedModules,
         return env.command === "serve" && !config.build?.ssr;
       },
       enforce: "post",
-      transform(code, id) {
+      async transform(code, id) {
         const layer = resolveLayer(getPath(id));
         if (layer && code.includes("import.meta.hot")) {
-          return `${code}
-if (import.meta.hot) {
-  try { await import.meta.hot.send('${WS_EVENT_PREFIX}', ['${layer}', __vite__css.slice(2,${2 + HASH_LENGTH})]); }
-  catch (e) { console.warn('[unocss-hmr]', e) }
-  if (!import.meta.url.includes('?'))
-    await new Promise(resolve => setTimeout(resolve, 100))
-}`;
+          let hmr = `
+try {
+  await import.meta.hot.send('${WS_EVENT_PREFIX}', ['${layer}', __vite__css.slice(2,${2 + HASH_LENGTH})]);
+} catch (e) {
+  console.warn('[unocss-hmr]', e)
+}
+if (!import.meta.url.includes('?'))
+  await new Promise(resolve => setTimeout(resolve, 100))`;
+          const config = await getConfig();
+          if (config.hmrTopLevelAwait === false)
+            hmr = `;(async function() {${hmr}
+})()`;
+          hmr = `
+if (import.meta.hot) {${hmr}}`;
+          return code + hmr;
         }
       }
     }

package/dist/index.d.ts

@@ -30,16 +30,27 @@ interface VitePluginConfig<Theme extends {} = {}> extends UserConfig<Theme> {
      */
     transformCSS?: boolean | 'pre' | 'post';
     /**
+     * Make the generated css processed by postcss (https://vitejs.dev/guide/features.html#postcss)
      *
-     * make the generated css processed by postcss (https://vitejs.dev/guide/features.html#postcss)
      * @default true
      */
     postcss?: boolean;
+    /**
+     * Use top level await in HMR code to avoid FOUC on dev time.
+     *
+     * You usually don't need to disable this, unless you are developing on
+     * a browser that does not support top level await.
+     *
+     * This will only affect on dev time.
+     *
+     * @default true
+     */
+    hmrTopLevelAwait?: boolean;
 }
 
 declare function ChunkModeBuildPlugin({ uno, filter }: UnocssPluginContext): Plugin;
 
-declare function GlobalModeDevPlugin({ uno, tokens, tasks, flushTasks, affectedModules, onInvalidate, extract, filter }: UnocssPluginContext): Plugin[];
+declare function GlobalModeDevPlugin({ uno, tokens, tasks, flushTasks, affectedModules, onInvalidate, extract, filter, getConfig }: UnocssPluginContext): Plugin[];
 
 declare function GlobalModeBuildPlugin(ctx: UnocssPluginContext<VitePluginConfig>): Plugin[];
 

package/dist/index.mjs

@@ -503,7 +503,7 @@ function GlobalModeBuildPlugin(ctx) {
 const WARN_TIMEOUT = 2e4;
 const WS_EVENT_PREFIX = "unocss:hmr";
 const HASH_LENGTH = 6;
-function GlobalModeDevPlugin({ uno, tokens, tasks, flushTasks, affectedModules, onInvalidate, extract, filter }) {
+function GlobalModeDevPlugin({ uno, tokens, tasks, flushTasks, affectedModules, onInvalidate, extract, filter, getConfig }) {
   const servers = [];
   let base = "";
   const entries = /* @__PURE__ */ new Set();
@@ -639,16 +639,24 @@ function GlobalModeDevPlugin({ uno, tokens, tasks, flushTasks, affectedModules,
         return env.command === "serve" && !config.build?.ssr;
       },
       enforce: "post",
-      transform(code, id) {
+      async transform(code, id) {
         const layer = resolveLayer(getPath(id));
         if (layer && code.includes("import.meta.hot")) {
-          return `${code}
-if (import.meta.hot) {
-  try { await import.meta.hot.send('${WS_EVENT_PREFIX}', ['${layer}', __vite__css.slice(2,${2 + HASH_LENGTH})]); }
-  catch (e) { console.warn('[unocss-hmr]', e) }
-  if (!import.meta.url.includes('?'))
-    await new Promise(resolve => setTimeout(resolve, 100))
-}`;
+          let hmr = `
+try {
+  await import.meta.hot.send('${WS_EVENT_PREFIX}', ['${layer}', __vite__css.slice(2,${2 + HASH_LENGTH})]);
+} catch (e) {
+  console.warn('[unocss-hmr]', e)
+}
+if (!import.meta.url.includes('?'))
+  await new Promise(resolve => setTimeout(resolve, 100))`;
+          const config = await getConfig();
+          if (config.hmrTopLevelAwait === false)
+            hmr = `;(async function() {${hmr}
+})()`;
+          hmr = `
+if (import.meta.hot) {${hmr}}`;
+          return code + hmr;
         }
       }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unocss/vite",
-  "version": "0.48.2",
+  "version": "0.48.4",
   "description": "The Vite plugin for UnoCSS",
   "author": "Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -44,17 +44,17 @@
   "dependencies": {
     "@ampproject/remapping": "^2.2.0",
     "@rollup/pluginutils": "^5.0.2",
-    "@unocss/config": "0.48.2",
-    "@unocss/core": "0.48.2",
-    "@unocss/inspector": "0.48.2",
-    "@unocss/scope": "0.48.2",
-    "@unocss/transformer-directives": "0.48.2",
+    "@unocss/config": "0.48.4",
+    "@unocss/core": "0.48.4",
+    "@unocss/inspector": "0.48.4",
+    "@unocss/scope": "0.48.4",
+    "@unocss/transformer-directives": "0.48.4",
     "chokidar": "^3.5.3",
     "fast-glob": "^3.2.12",
     "magic-string": "^0.27.0"
   },
   "devDependencies": {
-    "@unocss/shared-integration": "0.48.2",
+    "@unocss/shared-integration": "0.48.4",
     "vite": "^4.0.4"
   },
   "scripts": {