bug: ionicons not showing with ionic/vue

Bug Report

Ionic version:

[x] 4.x

Current behavior:

Icons are not showing in the frontend. This is a strange behaviour since the X icon and the hamburger menu icon are showing correctly. In fact all the icons in this list are working fine: ‘ios-close’: icons.close.ios, ‘md-close’: icons.close.md, ‘ios-reorder’: icons.reorder.ios, ‘md-reorder’: icons.reorder.md, ‘ios-menu’: icons.menu.ios, ‘md-menu’: icons.menu.md, ‘ios-arrow-forward’: icons.arrowForward.ios, ‘md-arrow-forward’: icons.arrowForward.md, ‘ios-arrow-back’: icons.arrowBack.ios, ‘md-arrow-back’: icons.arrowBack.md, ‘ios-arrow-down’: icons.arrowDown.ios, ‘md-arrow-down’: icons.arrowDown.md, ‘ios-search’: icons.search.ios, ‘md-search’: icons.search.md, ‘ios-close-circle’: icons.closeCircle.ios, ‘md-close-circle’: icons.closeCircle.md,

These are the ones that are loaded by the appInitialize method in ionic-vue.common.js I can’t understand why the all the other icons are not working. As far as I can tell all the ionicons should be available straight out of the box when using ionic right?

Expected behavior:

The icon should appear

Steps to reproduce:

Related code:

<ion-button @click="startTraining">
                  
                        <ion-icon slot="icon-only" name="play"></ion-icon>
                    </ion-button>
                    <ion-button @click="close">
                        <ion-icon slot="icon-only" name="close"></ion-icon>
                    </ion-button>

The close icon is rendered correctly, the play's not.

Other information:

Ionic info:

Ionic:

   Ionic CLI : 5.4.16

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v12.14.0
   npm    : 6.13.4
   OS     : macOS Catalina

[cabassi]

Thanks @rjurado01, I already know how to manually add icons. What I’m saying is that per documentations all the icons should be available without having to add them manually.

[liamdebeasi]

Thanks for the issue. I am going to close this as we are waiting for Vue 3 to stabilize before we push forward with Ionic Vue development. Once Vue 3 stabilizes we will look into providing an update that brings better support for Ionicons (namely Ionicons v5). Thanks!