5

I am writing a web application and trying to use font-awesome icons. The fonts are imported to the right directories but when I load the page the icons appear as blank squares. (Example in attached picture).

enter image description here

When I press F12 this is the error I get: (Also in attached picture)

Failed to load resource: the server responded with fontawesome-webfont.woff2 a status of 404 (Not Found)

Failed to load resource: the server responded with fontawesome-webfont.woff a status of 404 (Not Found)

Failed to load resource: the server responded with fontawesome-webfont.ttf a status of 404 (Not Found)

enter image description here

Those files do exist and I can see them. I managed to find some solutions by changing the web.config file but this is not helping with laravel. I can't find any appropriate solution for laravel 5.5 online. Would appreciate help!

PS - I don't know yet if this is relevant, but I use the icons in vue.js components.

Isabelle Meif
  • 51
  • 3
  • 1
    Have you run `npm install` and `npm run dev` or `npm run prod` ? – Marcin Nabiałek Dec 21 '17 at 15:17
  • @MarcinNabiałek yes i have run `npm install` and`npm run dev`, i have also run `npm run watch`. The more I look it appears to be related to those file extensions and mime-types, but nothing i tried works. – Isabelle Meif Dec 21 '17 at 16:04

1 Answers1

0

IIS will not serve files of unknown type.

  1. In IIS, go to MIME Types.
  2. Right click in a blank area and select Add.
  3. File name extension: .woff2
  4. MIME type: font/x-woff
  5. Click OK

enter image description here

llessurt
  • 555
  • 3
  • 14