vite-plugin-build-version-file 0.1.15 → 0.1.17

package/README.md

@@ -387,10 +387,21 @@ checkVersion()
 ```ts
 import { clearUrlCache } from 'vite-plugin-build-version-file/client'
 
-await clearUrlCache('/vue-app/')
+await clearUrlCache({
+  urls: ['/vue-app/', '/vue-app/index.html'],
+  redirectUrl: '/vue-app/',
+  time: 5
+})
 ```
 
-`url` 可省略；省略时默认使用 `location.origin + location.pathname`，不包含当前 query/hash：
+调用后会显示全屏 loading 和刷新倒计时。`time` 单位为秒，默认值为 `5`；缓存处理提前完成时会立即刷新，到达时限后则无论调用结果如何都会刷新。
+
+参数对象可省略。无参时按顺序检测以下两组 URL：
+
+1. `location.origin + location.pathname`
+2. 第一组 URL 拼接 `index.html`
+
+两组完成后，默认携带随机时间戳跳转到第一组 URL：
 
 ```ts
 await clearUrlCache()
@@ -853,10 +864,21 @@ Recommendations:
 ```ts
 import { clearUrlCache } from 'vite-plugin-build-version-file/client'
 
-await clearUrlCache('/vue-app/')
+await clearUrlCache({
+  urls: ['/vue-app/', '/vue-app/index.html'],
+  redirectUrl: '/vue-app/',
+  time: 5
+})
 ```
 
-The `url` argument is optional. When omitted, `location.origin + location.pathname` is used without the current query/hash:
+The method displays a full-screen loading mask and refresh countdown after it is called. `time` is measured in seconds and defaults to `5`. It refreshes immediately if cache processing finishes early; once the limit is reached, it refreshes regardless of the processing result.
+
+The options object is optional. Without arguments, the following URL groups are checked in order:
+
+1. `location.origin + location.pathname`
+2. The first URL with `index.html` appended
+
+After both groups complete, the method navigates to the first URL with a random timestamp:
 
 ```ts
 await clearUrlCache()

package/dist/client.cjs

@@ -25,7 +25,32 @@ __export(client_exports, {
 module.exports = __toCommonJS(client_exports);
 var CACHE_BUST_PARAM = "_";
 var IFRAME_ID = "vite-plugin-build-version-file-cache-iframe";
+var LOADING_ID = "vite-plugin-build-version-file-loading";
 var IFRAME_TIMEOUT = 5e3;
+var DEFAULT_REFRESH_TIME = 5;
+function showLoading(time) {
+  document.getElementById(LOADING_ID)?.remove();
+  const loading = document.createElement("div");
+  const spinner = document.createElement("div");
+  const text = document.createElement("div");
+  const deadline = Date.now() + time * 1e3;
+  loading.id = LOADING_ID;
+  loading.style.cssText = "position:fixed;inset:0;z-index:2147483647;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(0,0,0,.65);color:#fff;font:14px/1.5 sans-serif;";
+  spinner.style.cssText = "width:36px;height:36px;margin-bottom:16px;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:vite-build-version-loading .8s linear infinite;";
+  text.textContent = `\u8BF7\u7A0D\u7B49\uFF0C\u6B63\u5728\u68C0\u6D4B\u66F4\u65B0...\uFF08${Math.ceil(time)}\u79D2\uFF09`;
+  const style = document.createElement("style");
+  style.textContent = "@keyframes vite-build-version-loading{to{transform:rotate(360deg)}}";
+  loading.append(style, spinner, text);
+  document.documentElement.appendChild(loading);
+  const countdown = window.setInterval(() => {
+    const seconds = Math.max(0, Math.ceil((deadline - Date.now()) / 1e3));
+    text.textContent = `\u8BF7\u7A0D\u7B49\uFF0C\u6B63\u5728\u68C0\u6D4B\u66F4\u65B0...\uFF08${seconds}\u79D2\uFF09`;
+  }, 1e3);
+  return () => {
+    window.clearInterval(countdown);
+    loading.remove();
+  };
+}
 function createCacheBustedUrl(url) {
   const targetUrl = new URL(url, window.location.href);
   const hash = targetUrl.hash;
@@ -37,6 +62,14 @@ function createCacheBustedUrl(url) {
   targetUrl.hash = hash;
   return targetUrl.href;
 }
+function createIndexUrl(url) {
+  const targetUrl = new URL(url);
+  if (!targetUrl.pathname.endsWith("/")) {
+    targetUrl.pathname += "/";
+  }
+  targetUrl.pathname += "index.html";
+  return targetUrl.href;
+}
 function loadIframe(url) {
   return new Promise((resolve) => {
     document.getElementById(IFRAME_ID)?.remove();
@@ -59,7 +92,7 @@ function loadIframe(url) {
     document.documentElement.appendChild(iframe);
   });
 }
-async function clearUrlCache(url = window.location.origin + window.location.pathname) {
+async function clearTargetUrlCache(url) {
   const targetUrl = new URL(url, window.location.href).href;
   console.info(`[vite-plugin-build-version] Clear cache for ${targetUrl}`);
   await Promise.allSettled([
@@ -70,10 +103,37 @@ async function clearUrlCache(url = window.location.origin + window.location.path
       (response) => response.arrayBuffer()
     )
   ]);
+  await loadIframe(createCacheBustedUrl(targetUrl));
+}
+async function clearUrlCache(options = {}) {
+  const defaultUrl = window.location.origin + window.location.pathname;
+  const urls = options.urls ?? [defaultUrl, createIndexUrl(defaultUrl)];
+  const configuredTime = options.time;
+  const time = typeof configuredTime === "number" && Number.isFinite(configuredTime) && configuredTime > 0 ? configuredTime : DEFAULT_REFRESH_TIME;
+  const redirectUrl = new URL(
+    options.redirectUrl ?? urls[0] ?? defaultUrl,
+    window.location.href
+  ).href;
+  const hideLoading = showLoading(time);
+  let refreshTimeout = 0;
   try {
-    await loadIframe(createCacheBustedUrl(targetUrl));
+    await Promise.race([
+      (async () => {
+        for (const url of urls) {
+          try {
+            await clearTargetUrlCache(url);
+          } catch {
+          }
+        }
+      })(),
+      new Promise((resolve) => {
+        refreshTimeout = window.setTimeout(resolve, time * 1e3);
+      })
+    ]);
   } finally {
-    window.location.replace(createCacheBustedUrl(targetUrl));
+    window.clearTimeout(refreshTimeout);
+    hideLoading();
+    window.location.replace(createCacheBustedUrl(redirectUrl));
   }
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/client.d.cts

@@ -1,3 +1,8 @@
-declare function clearUrlCache(url?: string): Promise<void>;
+interface ClearUrlCacheOptions {
+    urls?: string[];
+    redirectUrl?: string;
+    time?: number;
+}
+declare function clearUrlCache(options?: ClearUrlCacheOptions): Promise<void>;
 
-export { clearUrlCache };
+export { type ClearUrlCacheOptions, clearUrlCache };

package/dist/client.d.ts

@@ -1,3 +1,8 @@
-declare function clearUrlCache(url?: string): Promise<void>;
+interface ClearUrlCacheOptions {
+    urls?: string[];
+    redirectUrl?: string;
+    time?: number;
+}
+declare function clearUrlCache(options?: ClearUrlCacheOptions): Promise<void>;
 
-export { clearUrlCache };
+export { type ClearUrlCacheOptions, clearUrlCache };

package/dist/client.mjs

@@ -1,7 +1,32 @@
 // src/client.ts
 var CACHE_BUST_PARAM = "_";
 var IFRAME_ID = "vite-plugin-build-version-file-cache-iframe";
+var LOADING_ID = "vite-plugin-build-version-file-loading";
 var IFRAME_TIMEOUT = 5e3;
+var DEFAULT_REFRESH_TIME = 5;
+function showLoading(time) {
+  document.getElementById(LOADING_ID)?.remove();
+  const loading = document.createElement("div");
+  const spinner = document.createElement("div");
+  const text = document.createElement("div");
+  const deadline = Date.now() + time * 1e3;
+  loading.id = LOADING_ID;
+  loading.style.cssText = "position:fixed;inset:0;z-index:2147483647;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(0,0,0,.65);color:#fff;font:14px/1.5 sans-serif;";
+  spinner.style.cssText = "width:36px;height:36px;margin-bottom:16px;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:vite-build-version-loading .8s linear infinite;";
+  text.textContent = `\u8BF7\u7A0D\u7B49\uFF0C\u6B63\u5728\u68C0\u6D4B\u66F4\u65B0...\uFF08${Math.ceil(time)}\u79D2\uFF09`;
+  const style = document.createElement("style");
+  style.textContent = "@keyframes vite-build-version-loading{to{transform:rotate(360deg)}}";
+  loading.append(style, spinner, text);
+  document.documentElement.appendChild(loading);
+  const countdown = window.setInterval(() => {
+    const seconds = Math.max(0, Math.ceil((deadline - Date.now()) / 1e3));
+    text.textContent = `\u8BF7\u7A0D\u7B49\uFF0C\u6B63\u5728\u68C0\u6D4B\u66F4\u65B0...\uFF08${seconds}\u79D2\uFF09`;
+  }, 1e3);
+  return () => {
+    window.clearInterval(countdown);
+    loading.remove();
+  };
+}
 function createCacheBustedUrl(url) {
   const targetUrl = new URL(url, window.location.href);
   const hash = targetUrl.hash;
@@ -13,6 +38,14 @@ function createCacheBustedUrl(url) {
   targetUrl.hash = hash;
   return targetUrl.href;
 }
+function createIndexUrl(url) {
+  const targetUrl = new URL(url);
+  if (!targetUrl.pathname.endsWith("/")) {
+    targetUrl.pathname += "/";
+  }
+  targetUrl.pathname += "index.html";
+  return targetUrl.href;
+}
 function loadIframe(url) {
   return new Promise((resolve) => {
     document.getElementById(IFRAME_ID)?.remove();
@@ -35,7 +68,7 @@ function loadIframe(url) {
     document.documentElement.appendChild(iframe);
   });
 }
-async function clearUrlCache(url = window.location.origin + window.location.pathname) {
+async function clearTargetUrlCache(url) {
   const targetUrl = new URL(url, window.location.href).href;
   console.info(`[vite-plugin-build-version] Clear cache for ${targetUrl}`);
   await Promise.allSettled([
@@ -46,10 +79,37 @@ async function clearUrlCache(url = window.location.origin + window.location.path
       (response) => response.arrayBuffer()
     )
   ]);
+  await loadIframe(createCacheBustedUrl(targetUrl));
+}
+async function clearUrlCache(options = {}) {
+  const defaultUrl = window.location.origin + window.location.pathname;
+  const urls = options.urls ?? [defaultUrl, createIndexUrl(defaultUrl)];
+  const configuredTime = options.time;
+  const time = typeof configuredTime === "number" && Number.isFinite(configuredTime) && configuredTime > 0 ? configuredTime : DEFAULT_REFRESH_TIME;
+  const redirectUrl = new URL(
+    options.redirectUrl ?? urls[0] ?? defaultUrl,
+    window.location.href
+  ).href;
+  const hideLoading = showLoading(time);
+  let refreshTimeout = 0;
   try {
-    await loadIframe(createCacheBustedUrl(targetUrl));
+    await Promise.race([
+      (async () => {
+        for (const url of urls) {
+          try {
+            await clearTargetUrlCache(url);
+          } catch {
+          }
+        }
+      })(),
+      new Promise((resolve) => {
+        refreshTimeout = window.setTimeout(resolve, time * 1e3);
+      })
+    ]);
   } finally {
-    window.location.replace(createCacheBustedUrl(targetUrl));
+    window.clearTimeout(refreshTimeout);
+    hideLoading();
+    window.location.replace(createCacheBustedUrl(redirectUrl));
   }
 }
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-build-version-file",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "description": "A Vite plugin that emits version.json and injects version metadata into HTML.",
   "license": "MIT",
   "type": "module",