Need help with icons

Hi everyone,
I need help with F7 Icons. I used f7-CLI v4.1.0 to create the app from a template, but I had to create it without icons because using it generates an error that blocks the creation. So, I am trying to add them after the creation. I installed f7-icons with npm, imported them into app.js (import ‘framework7-icons’). I also tried to copy font and CSS in a folder and import them in app.js, but the app does not display them, I can see only this:

Did I forget to do something? Where are my mistakes?
Thanks :pray:

What is this?

You need to import stylesheet propely, probably

import 'framework7-icons/css/framework7-icons.css';

I found it on Github’s page of F7Icons

I added import 'framework7-icons/css/framework7-icons.css'; in app.js but nothing changed.

I also have this 2 errors for every icon
Failed to decode downloaded font: <URL>]
OTS parsing error: invalid sfntVersion: 1008813135

Then copy required CSS and font files locally to your src folder and include it from there

I did it. Here is my app.js with on the left the folder structure

Here is my framework7-icons.css

It still does not work, I don’t know what I forgot

Thank you

I found the problem. Is css-loader that has to be downgraded to the 5.2.7 version. After doing that it works.

1 Like

For sure, you don’t need to import framework7-icons.css 2 times, just keep the local one

Sure, I imported it 2 times just to see if it works, but the problem was the ccs-loader.