Bug with icons in Mobile - the images don't load

[garcilaso]

There’s a bug with icons in the mobile version. Basically some of the icons are not displayed.

This is how the mobile menu of my app looks in the editor:

And this is how it looks in production:

If doesn’t matter if I open it in the app, in the mobile browser, or if I just put a smaller screen on the laptop until it displays the mobile version.

I am not using so may icons in the desktop version so I am not sure if there can be similar issues on that one or it is just on the mobile view.

It looks like a bug. Has anyone seen this before?

Thank you

[Joyce (K)]

Hi @garcilaso

Are you using bindings to display these icons dynamically?

If you are, the issue may be coming from using concatenation in your bindings. Here’s a section of the docs that explains how to avoid that: Icon | Documentation

If that doesn’t solve the issue, could you create a bug ticket here if you haven’t already?

[garcilaso]

Hi Joyce, the icons are binded but I’m not using any concatenations. I’m creating a ticket. Thank you for your quick answer!

[thomlov (Thomas Løvdahl)]

Icons do not appear in production

Dynamic icons does not work. You have to declare each icon name as a comment in the header to be able to use them dynamically in your app. The reason is the icons is only included in the build if they are present in the app at build time. Dynamic data is not present at build time and therefore does not work. Example comment in header: <!-- phosphor-regular/basket phosphor-regular/list-dashes phosphor-regular/plus-square -->

[garcilaso]

Thank you very much for your response!

I added a div in the header of the page, kept it hidden, and included all the icons I’m using dynamically — now they load perfectly.

Best regards,
Jorge.