Ion-icon not showing in ionic vue

If you’re using Ionic Framework, Ionicons is packaged by default, so no installation is necessary.

So how do we get them working in a vue 3 project?

Start by importing your ion icon:

import {heart} from 'ionicons/icons';

If you’re using the composition API, return the icon in your setup:

setup() {
    return {
        heart
    }
}

Last step is adding the icon in your html:

<ion-icon :icon="heart"></ion-icon>

More general information can be found on: https://ionicons.com/usage

Hopefully this saves you some time!