First of all, I want to express my gratitude to the developers for their hard work on this project. Thank you!
I'm currently using the @iconify/vue library, which exports an Icon Vue component. I'd like to leverage the AutoImport library's imports feature to simplify the import process. Here's the relevant part of my code:
However, even with this setup, I'm facing an issue. When I try to use the Icon component directly in a Vue template like this:
<Icon icon="ep:plus"></Icon>
It doesn't work as expected. I still have to manually import it in the script section like so:
<script setup lang="ts">
import { Icon } from '@iconify/vue'
</script>
This issue has been bothering me for quite some time, and I would greatly appreciate any guidance or solutions you can provide. Thank you in advance for your assistance!
Update:
It's quite peculiar; if I use dynamic components like this:
Describe the bug
First of all, I want to express my gratitude to the developers for their hard work on this project. Thank you!
I'm currently using the @iconify/vue library, which exports an Icon Vue component. I'd like to leverage the AutoImport library's imports feature to simplify the import process. Here's the relevant part of my code:
vite.config.ts
:However, even with this setup, I'm facing an issue. When I try to use the Icon component directly in a Vue template like this:
It doesn't work as expected. I still have to manually import it in the script section like so:
This issue has been bothering me for quite some time, and I would greatly appreciate any guidance or solutions you can provide. Thank you in advance for your assistance!
Update:
It's quite peculiar; if I use dynamic components like this:
It renders correctly.
Reproduction
https://stackblitz.com/edit/vitejs-vite-gsph2u?file=src%2FApp.vue
System Info
Used Package Manager
npm
Validations