docs(icons): add warning about dash collections in vue (#4307)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Estéban
2025-07-01 18:00:12 +02:00
committed by GitHub
parent f903ec396f
commit 15482aae76

View File

@@ -32,6 +32,12 @@ props:
You can use any name from the <https://icones.js.org> collection.
::
::warning
When using collections with a dash (`-`), you need to separate the icon name from the collection name with a colon (`:`) as `@iconify/vue` does not handle this case like `@nuxt/icon`. For example, instead of `i-simple-icons-github` you need to write `i-simple-icons:github` or `simple-icons:github`.
Learn more about the [Iconify naming convention](https://iconify.design/docs/icon-components/vue/#icon).
::
### Component Props
Some components also have an `icon` prop to display an icon, like the [Button](/components/button) for example: