Merge pull request #47 from nuxt-modules/fix/autocomplete-aliases

nuxt · Jan 25, 2023 · abc2249 · abc2249
2 parents 531a048 + 756c6b0
commit abc2249
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/playground/app.vue b/playground/app.vue
@@ -5,6 +5,7 @@
       <Icon name="uil:github" />
       <Icon name="uil:github" size="24" />
       <Icon name="uil:github" size="48" />
+      <Icon name="" />
     </p>
     <p>
       Custom component:

diff --git a/src/runtime/Icon.vue b/src/runtime/Icon.vue
@@ -5,23 +5,29 @@ import type { IconifyIcon } from '@iconify/vue'
 import { Icon as Iconify } from '@iconify/vue/dist/offline'
 import { loadIcon } from '@iconify/vue'
 import { useNuxtApp, useState, ref, useAppConfig, computed, watch } from '#imports'
-import type { AppConfig } from '@nuxt/schema'
 
 const nuxtApp = useNuxtApp()
-const appConfig = useAppConfig() as any
+const appConfig = useAppConfig()
+
+// @ts-ignore
+const aliases = appConfig?.nuxtIcon?.aliases || {}
+
+type AliasesKeys = keyof typeof aliases
+
 const props = defineProps({
   name: {
-    type: String as PropType<keyof AppConfig['nuxtIcon']['aliases'] | (string & {})>,
+    type: String as PropType<AliasesKeys | (string & {})>,
     required: true
   },
   size: {
     type: String,
     default: ''
   }
 })
+
 const state = useState<Record<string, IconifyIcon | undefined>>('icons', () => ({}))
 const isFetching = ref(false)
-const iconName = computed(() => (appConfig.nuxtIcon?.aliases || {})[props.name] || props.name)
+const iconName = computed(() => ((appConfig as any)?.nuxtIcon?.aliases || {})[props.name] || props.name)
 const icon = computed<IconifyIcon | undefined>(() => state.value?.[iconName.value])
 const component = computed(() => nuxtApp.vueApp.component(iconName.value))
 const sSize = computed(() => {
@@ -31,7 +37,7 @@ const sSize = computed(() => {
   }
   return size
 })
-const className = computed(() => appConfig.nuxtIcon?.class ?? 'icon')
+const className = computed(() => (appConfig as any)?.nuxtIcon?.class ?? 'icon')
 
 async function loadIconComponent () {
   if (component.value) {