Need help with icons

1

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:
image

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

2

What is this?

You need to import stylesheet propely, probably

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

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

4

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

5

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

image
image914×857 53.4 KB

6

Here is my framework7-icons.css

image
image771×692 31.3 KB

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

Thank you

7

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
8

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

9

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

Thanks