From e9405e2533030055a67f7a1f173b53728872182f Mon Sep 17 00:00:00 2001
From: Divyansh Singh <40380293+brc-dd@users.noreply.github.com>
Date: Sat, 29 Aug 2026 02:09:33 +0530
Subject: [PATCH] refactor: rename the dev icon endpoint to /_vpi/

/@-prefixed paths read as vite module-graph ids (/@id/, /@fs/, /@vite/);
this is a plain asset url, so follow the nuxt-style underscore prefix,
matching the vpi- class prefix.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 __tests__/e2e/icons/icons.test.ts  | 10 +++-------
 src/client/app/composables/icon.ts |  2 +-
 src/node/plugins/iconsPlugin.ts    |  4 ++--
 3 files changed, 6 insertions(+), 10 deletions(-)

diff --git a/__tests__/e2e/icons/icons.test.ts b/__tests__/e2e/icons/icons.test.ts
index 66bc0fa0..e1127b2e 100644
--- a/__tests__/e2e/icons/icons.test.ts
+++ b/__tests__/e2e/icons/icons.test.ts
@@ -20,7 +20,7 @@ describe('icons', () => {
       if (!url.startsWith(`http://localhost:${process.env['PORT']}`)) {
         externalRequests.push(url)
       }
-      if (url.includes('/@vpicons/')) devIconRequests.push(url)
+      if (url.includes('/_vpi/')) devIconRequests.push(url)
     })
   })
 
@@ -93,14 +93,10 @@ describe('icons', () => {
         )
         if (!el) return false
         const styles = getComputedStyle(el)
-        return (styles.maskImage || styles.webkitMaskImage).includes(
-          '/@vpicons/'
-        )
+        return (styles.maskImage || styles.webkitMaskImage).includes('/_vpi/')
       })
       expect(
-        devIconRequests.some((url) =>
-          url.includes('/@vpicons/lucide/heart.svg')
-        )
+        devIconRequests.some((url) => url.includes('/_vpi/lucide/heart.svg'))
       ).toBe(true)
     }
   )
diff --git a/src/client/app/composables/icon.ts b/src/client/app/composables/icon.ts
index 8fd6e16f..ab2d5ebb 100644
--- a/src/client/app/composables/icon.ts
+++ b/src/client/app/composables/icon.ts
@@ -58,7 +58,7 @@ export function useIcon(
         applied = key
         span.style.setProperty(
           '--icon',
-          `url('${withBase(`/@vpicons/${name.collection}/${name.icon}.svg`)}')`
+          `url('${withBase(`/_vpi/${name.collection}/${name.icon}.svg`)}')`
         )
         // inline the mask setup for themes without the default icon rules
         const styles = getComputedStyle(span)
diff --git a/src/node/plugins/iconsPlugin.ts b/src/node/plugins/iconsPlugin.ts
index 28b8269c..548d5011 100644
--- a/src/node/plugins/iconsPlugin.ts
+++ b/src/node/plugins/iconsPlugin.ts
@@ -4,10 +4,10 @@ import type { Plugin } from 'vite'
 import { resolveIconSVG } from '../icons'
 import type { SiteConfig } from '../siteConfig'
 
-const iconRequestRE = /\/@vpicons\/([a-z0-9-]+)\/([a-z0-9-]+)\.svg$/
+const iconRequestRE = /\/_vpi\/([a-z0-9-]+)\/([a-z0-9-]+)\.svg$/
 
 /**
- * Serves `/@vpicons/<collection>/<name>.svg` in dev from locally installed
+ * Serves `/_vpi/<collection>/<name>.svg` in dev from locally installed
  * `@iconify-json/*` collections (requested on demand by `useIcon`).
  */
 export function iconsPlugin(siteConfig: SiteConfig): Plugin {