some ionicons not showing

Question

I have noticed that some of the icons I am using in my cordova project are not displaying on any of my devices. The ones that aren\'t working seem to have the word ios or an

Answer 1

I had the same issue. The easiest way to resolve:

Delete www/ionic/fonts and www/ionic/scss/ionicons directory.

Then run ionic lib update from your project root directory.

Answer 2

Looks like you're using Ionic, rather than just Cordova.

You could do a partial upgrade to the forthcoming release of Ionic, which includes Ionicons v2:

1. Download /config/lib/fonts and /scss/ionicons from the latest nightly into the corresponding places in your /www/lib folder

2. Make sure you have gulp installed locally: npm install gulp

3. Run ionic setup sass (NOTE: backup your ionic.project file first as this makes some changes)

4. Replace the files in /www/lib/ionic/css with the new ones in /www/css (requires some renaming).

5. Fix the relative paths in these copied files: replace ../lib/ionic/fonts with ../fonts

I'm sure there's an easier way, but this worked for me. Someone's made a feature suggestion for always keeping ionicons up to date.

---

Update:

Animated icons aren't supported with Ionicons v2 yet (ion-spinner will be the replacement). Here's a hack to get them back:

https://github.com/driftyco/ionicons/issues/111#issuecomment-65788526

You need to add display:inline-block to the animation class to work on Android.

Answer 3

i guess it might be about the used version of ionic if it's V5 or if @ionic/angular's version is V5 you need then to use ionicons from version 5 not 4 (they have different names).

Answer 4

For newer versions just use:

<ion-spinner></ion-spinner>

more: ion-spinner

Answer 5

Apparently the latest version of ionic when building an ionic app using ionic start from CMD loads an outdated icon library v1.5.2 (latest is v2.0.0).

• To update the fonts go to the latest ionicons site and download.
• Unzip and navigate to the /fonts dir and copy these 4 files to the www/lib/ionic/fonts dir of your app (overwrite).
• Do the same for the scss folder and paste to www/lib/ionic/scss/ionicons (overwrite).
• Lastly open the ionicons.css file from your extracted zip file /css/ionicicons.css and copy the contents of that file to www/lib/ionic/css/ionicons.css (NOTE: Make sure you edit and only replace the existing font version takes up about the first 1500 - 2000 lines, you will see the comments indicating)