question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Ionic 4: Ionicons not shown on Android

See original GitHub issue

Bug Report

Ionic Info

   @ionic/cli-utils  : 2.0.0-rc.6
   ionic (Ionic CLI) : 4.0.0-rc.6

global packages:

   cordova (Cordova CLI) : 8.0.0

local packages:

   @angular-devkit/core       : 0.6.0
   @angular-devkit/schematics : 0.6.0
   @angular/cli               : 6.0.1
   @ionic/schematics-angular  : 1.0.0-rc.5
   Cordova Platforms          : android 7.1.0
   Ionic Framework            : @ionic/angular 4.0.0-alpha.7

Describe the Bug The ionicons are not shown on Android when using Ionic 4 (and so Iconicons 4.x). In console you can see the error message: “Fetch API cannot load file:///android_asset/www/svg/md-arrow-forward.svg. URL scheme “file” is not supported.”

Steps to Reproduce / Related Code Just use the Ionic Conference App (Branch: core-update - https://github.com/ionic-team/ionic-conference-app) let it run on Android (ionic cordova run android)

Expected Behavior THe icons should show

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:9
  • Comments:33 (11 by maintainers)

github_iconTop GitHub Comments

3reactions
jgw96commented, Jul 12, 2018

Hello all! This has been fixed with the latest versions of Ionic and our new beta version of the webview plugin. To get the fix first make sure you have the latest version of ionic 4 (npm install @ionic/angular@4.0.0-alpha.10 --save-exact) and then run these two commands ionic cordova plugin rm cordova-plugin-ionic-webview ionic cordova plugin add cordova-plugin-ionic-webview@2.0.0-beta.1 . Thanks!

2reactions
orlyappscommented, May 31, 2018

I added this snippet in the angular.json file

 {
    "glob": "**/*.svg",
    "input": "node_modules/@ionic/angular/dist/ionic/svg",
    "output": "./svg"
 },

and used ng serve instead of ionic serve Now it works 😃

Read more comments on GitHub >

github_iconTop Results From Across the Web

Ionic android ion-icon not showing - Stack Overflow
The ion-icon not showing on my android device, i did this for making work the firebase googleAuth ! Do you have any suggestion...
Read more >
Android 8.1 Icons not displaying - Ionic Angular
Easiest way to prevent all ion-icons from displaying? Ionic App overlaps in a wear way on Android ZTE. richardshergold ...
Read more >
IonIcons not Showing on Android/IOS Device in ... - YouTube
IonIcons not Showing on Android /IOS Device in IONIC Cordova Application. Ionicons not showing in ionic react 4 application. ionicons svg not ......
Read more >
Ionicons Usage: Guidelines for installing and using ... - Ionic.io
Ionicons is an open-sourced and MIT licensed icon pack. The usage guidelines provide helpful tips for installing and using Ionicons Version 4.x in...
Read more >
Example to Use Ionicons in React Native using ... - About React
But if you want to show the different icons for Android and IOS for the same Icon component then you can also use...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found