Ionicons V4 custom svg with 'src='

Ionic Framework ionic-v3
1

I am reading about v4 icons and custom svg options with src="... in Ionicons Basic Usage, but I am not able to make it work.

See this Stackblitz example (ionicons updated to 4.1.2).

Same thing happens to me locally, in my Ionic app. (Ionicons also updated to 4.1.2)

When using this code:

<ion-icon src="./assets/imgs/simple-calculator2.svg"></ion-icon>

I am not getting icons to display.

<img src="./assets/imgs/simple-calculator2.svg"> works just fine, so link is accessible, and svg is ok.

Did anyone made it work?

1 Like
2

I haven’t been able to get this working either.

I’m not sure if Ionicons v4 is meant to work with Ionic 3 even?

Would be great if someone from the Ionic team could confirm this with us.

1 Like
3

Seems this feature is only available for the web component. I guess it’s not going to work for Ionic 2/3.

4

I have the same problem with using <ion-icon src="/path/icon.svg"></ion-icon> nothing shows up in my ionic. img src works fine.

my workaround is using this instruction: https://golb.hplar.ch/2018/01/Custom-SVG-icons-in-Ionic.html

5

That’s a neat trick. Thanks for sharing.
Hopefully we won’t be needing it soon - I hope V4 release is near…