NuxtUI3 Custom icons on vue app
Heyo I'm using nuxt ui on a vuejs app without nuxt and want to use custom icons but there's no docs on how to do that
https://ui.nuxt.com/getting-started/icons/vue
The nuxt docs have some info on that, requiring you to modify the nuxt config, which of course doesn't apply do my vue app
https://ui.nuxt.com/getting-started/icons/nuxt#custom-local-collections
Does somebody know how I can use custom icons? Thanks!
2 Replies
Hi @StefanH. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
You're correct that the Nuxt UI documentation provides clear instructions for adding custom icon collections in a Nuxt app via
I'm sorry, but the knowledge sources do not contain information on how to add custom icon collections to Nuxt UI when used in a plain Vue app (without Nuxt). The documented approach for custom icons is only available for Nuxt projects. If you need this feature, you may need to look for community solutions or open an issue on the Nuxt UI repository for further guidance. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
nuxt.config.ts
, but it does not provide explicit instructions for doing this in a plain Vue app. The knowledge sources only describe how to use custom local collections with Nuxt, not with Vue + Nuxt UI (standalone) setups. Specifically, the process involving the icon.customCollections
property is only documented for Nuxt projects, not for Vue projects using Nuxt UI as a component library Custom Local Collections.
For Vue apps, the documentation only covers how to use icons from Iconify collections by referencing their names (e.g., i-lucide-lightbulb
) and notes the naming convention differences (using :
instead of -
for some collections), but does not mention a way to register custom SVG icons or collections in a non-Nuxt environment Vue Icon Usage.
In summary:I'm sorry, but the knowledge sources do not contain information on how to add custom icon collections to Nuxt UI when used in a plain Vue app (without Nuxt). The documented approach for custom icons is only available for Nuxt projects. If you need this feature, you may need to look for community solutions or open an issue on the Nuxt UI repository for further guidance. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
<@211558054947192834> Kapa.ai is still learning and improving, please let me know how I did by reacting below.