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?

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!

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store