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>
pull/5407/head
Divyansh Singh 2 weeks ago
parent 98fafe4a01
commit e9405e2533

@ -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)
}
)

@ -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)

@ -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 {

Loading…
Cancel
Save