From dd41dd89b66142c7725c3e5e87e0bd290865b734 Mon Sep 17 00:00:00 2001
From: cosine7 <810196813@qq.com>
Date: Sat, 1 Nov 2025 11:10:13 +0800
Subject: [PATCH 1/4] fix: playground not working for alpha releases

---
 app/pages/index.vue | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/app/pages/index.vue b/app/pages/index.vue
index fbd598c..725cdf9 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -39,15 +39,22 @@ const vueUsePackages = [
   '@vueuse/rxjs',
 ]
 
-function generateVueUseImportCDNs() {
-  return vueUsePackages.map((p) => {
-    return [p, `https://cdn.jsdelivr.net/npm/${p}@${vueuseVersion.value}/index.mjs`]
-  })
-}
+const { data: vueUseImportCDNs } = await useAsyncData(
+  'vueUseImportCDNs',
+  async () => {
+    const packageJson = await $fetch<{ main: string }>(`https://cdn.jsdelivr.net/npm/${vueUsePackages[0]}@${vueuseVersion.value}/package.json`)
+    // main field possible values: './xx', 'xxx', '/xxx'
+    const main = packageJson.main.replace('.', '').replace('/', '')
+    return vueUsePackages.map((p) => {
+      return [p, `https://cdn.jsdelivr.net/npm/${p}@${vueuseVersion.value}/${main}`]
+    })
+  },
+  { watch: [vueuseVersion], default: () => ([]) },
+)
 
 const importMap = computed(() => {
   return mergeImportMap(builtinImportMap.value, {
-    imports: Object.fromEntries([...generateVueUseImportCDNs(), ['vue-demi', 'https://cdn.jsdelivr.net/npm/vue-demi@0.14.10/lib/index.mjs'], ['yaml', 'https://cdn.jsdelivr.net/npm/yaml@2.7.1/+esm']]),
+    imports: Object.fromEntries([...vueUseImportCDNs.value, ['vue-demi', 'https://cdn.jsdelivr.net/npm/vue-demi@0.14.10/lib/index.mjs'], ['yaml', 'https://cdn.jsdelivr.net/npm/yaml@2.7.1/+esm']]),
   })
 })
 

From 2475b45dfa77fe5e5f509723655ba9e6c6e3b447 Mon Sep 17 00:00:00 2001
From: cosine7 <810196813@qq.com>
Date: Sat, 1 Nov 2025 11:41:38 +0800
Subject: [PATCH 2/4] fix: use regex to replace ./

---
 app/pages/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/pages/index.vue b/app/pages/index.vue
index 725cdf9..884833f 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -44,7 +44,7 @@ const { data: vueUseImportCDNs } = await useAsyncData(
   async () => {
     const packageJson = await $fetch<{ main: string }>(`https://cdn.jsdelivr.net/npm/${vueUsePackages[0]}@${vueuseVersion.value}/package.json`)
     // main field possible values: './xx', 'xxx', '/xxx'
-    const main = packageJson.main.replace('.', '').replace('/', '')
+    const main = packageJson.main.replace(/^(\.\/|\/)+/, '')
     return vueUsePackages.map((p) => {
       return [p, `https://cdn.jsdelivr.net/npm/${p}@${vueuseVersion.value}/${main}`]
     })

From d08bd780e26539ee47625a03d4a83e248da80ef1 Mon Sep 17 00:00:00 2001
From: cosine7 <810196813@qq.com>
Date: Sat, 1 Nov 2025 12:11:30 +0800
Subject: [PATCH 3/4] fix: use package.json module field

---
 app/pages/index.vue | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/app/pages/index.vue b/app/pages/index.vue
index 884833f..a14e953 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -42,12 +42,10 @@ const vueUsePackages = [
 const { data: vueUseImportCDNs } = await useAsyncData(
   'vueUseImportCDNs',
   async () => {
-    const packageJson = await $fetch<{ main: string }>(`https://cdn.jsdelivr.net/npm/${vueUsePackages[0]}@${vueuseVersion.value}/package.json`)
-    // main field possible values: './xx', 'xxx', '/xxx'
-    const main = packageJson.main.replace(/^(\.\/|\/)+/, '')
-    return vueUsePackages.map((p) => {
-      return [p, `https://cdn.jsdelivr.net/npm/${p}@${vueuseVersion.value}/${main}`]
-    })
+    const packageJson = await $fetch<{ module: string }>(`https://cdn.jsdelivr.net/npm/${vueUsePackages[1]}@${vueuseVersion.value}/package.json`)
+    // module field possible values: './xx', 'xxx', '/xxx'
+    const entry = packageJson.module.replace(/^(\.\/|\/)+/, '')
+    return vueUsePackages.map(p => [p, `https://cdn.jsdelivr.net/npm/${p}@${vueuseVersion.value}/${entry}`])
   },
   { watch: [vueuseVersion], default: () => ([]) },
 )

From 666d759ae1a882a64dac4151e8c4bd0883052d75 Mon Sep 17 00:00:00 2001
From: cosine7 <810196813@qq.com>
Date: Sat, 1 Nov 2025 12:18:00 +0800
Subject: [PATCH 4/4] chore: hardcode @vueuse/core when fetch

---
 app/pages/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/pages/index.vue b/app/pages/index.vue
index a14e953..b9c80d2 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -42,7 +42,7 @@ const vueUsePackages = [
 const { data: vueUseImportCDNs } = await useAsyncData(
   'vueUseImportCDNs',
   async () => {
-    const packageJson = await $fetch<{ module: string }>(`https://cdn.jsdelivr.net/npm/${vueUsePackages[1]}@${vueuseVersion.value}/package.json`)
+    const packageJson = await $fetch<{ module: string }>(`https://cdn.jsdelivr.net/npm/@vueuse/core@${vueuseVersion.value}/package.json`)
     // module field possible values: './xx', 'xxx', '/xxx'
     const entry = packageJson.module.replace(/^(\.\/|\/)+/, '')
     return vueUsePackages.map(p => [p, `https://cdn.jsdelivr.net/npm/${p}@${vueuseVersion.value}/${entry}`])