diff --git a/plugins/plugin-iconify/src/client/components/Iconify.vue b/plugins/plugin-iconify/src/client/components/Iconify.vue
index 34df1bfb..3a347240 100644
--- a/plugins/plugin-iconify/src/client/components/Iconify.vue
+++ b/plugins/plugin-iconify/src/client/components/Iconify.vue
@@ -53,9 +53,6 @@ declare const __VUEPRESS_PLUGIN_ICONIFY_DEFAULT_COLOR__: string
class="vp-iconify"
:style="iconStyle"
/>
-
- {{ props.name }}
-
diff --git a/plugins/plugin-iconify/src/client/composables/iconify.ts b/plugins/plugin-iconify/src/client/composables/iconify.ts
index 1d324894..352a750f 100644
--- a/plugins/plugin-iconify/src/client/composables/iconify.ts
+++ b/plugins/plugin-iconify/src/client/composables/iconify.ts
@@ -1,13 +1,11 @@
import type { IconifyIcon } from '@iconify/vue'
import { loadIcon } from '@iconify/vue'
-import { computed, ref, watch } from 'vue'
-import type { ComputedRef, Ref } from 'vue'
+import { ref, watch } from 'vue'
+import type { Ref } from 'vue'
-const iconCache: Ref> = ref({})
-
-export function useIconify(name: ComputedRef | Ref) {
- const icon = computed(() => iconCache.value[name.value])
- const loaded = ref(true)
+export function useIconify(name: Ref) {
+ const icon = ref(null)
+ const loaded = ref(false)
async function loadIconComponent() {
if (icon.value)
@@ -16,7 +14,8 @@ export function useIconify(name: ComputedRef | Ref) {
if (!__VUEPRESS_SSR__) {
try {
loaded.value = false
- iconCache.value[name.value] = await loadIcon(name.value)
+ const cached = await loadIcon(name.value)
+ icon.value = cached
}
finally {
loaded.value = true
diff --git a/theme/src/client/config.ts b/theme/src/client/config.ts
index ae380bbc..c4549fa2 100644
--- a/theme/src/client/config.ts
+++ b/theme/src/client/config.ts
@@ -12,6 +12,9 @@ export default defineClientConfig({
enhance({ app, router }) {
// global component
app.component('Badge', Badge)
+
+ if (app._context.components.ExternalLinkIcon)
+ delete app._context.components.ExternalLinkIcon
app.component('ExternalLinkIcon', ExternalLinkIcon)
app.component('DocSearch', () => {