How to use mdi-svg

[BobTheShoplifter]

In vue 2 the trick was:

import { mdiArrowDownRight, mdiFormatQuoteOpen, mdiArrowRight } from '@mdi/js'

then

<v-icon size="19" :icon="mdiArrowRight"></v-icon></v-avatar>

But does it auto import the icons when setting

defaultSet: 'mdi-svg',

How can i for example use mdiArrowRight in my page?

[userquin]

Check https://vuetify-nuxt-module.netlify.app/guide/icons/svg-icons.html and https://vuetify-nuxt-module.netlify.app/guide/icons/integrations.html

[userquin]

If the question is about using it with v-icon you should ask in vuetify repo.

[BobTheShoplifter]

Importing works but i was wondering how the mdi-svg worked

[userquin]

Check any repo here: https://vuetify-nuxt-module.netlify.app/guide/icons/integrations.html

Basically v-icon accepts an string or a component, it just renders it: @mdi/js just exports the svg icons as js objects, then v-icon just renders the corresponding icon.

[BobTheShoplifter]

Yeah, i am wondering how do i access the js object that @mdi/js exports?

[userquin]

just import the icon you want: import { mdiArrowDownRight, mdiFormatQuoteOpen, mdiArrowRight } from '@mdi/js'

[BobTheShoplifter]

Aha! Yes this is what i am doing right now. I just tought the imports was automatic in all components and pages