FortAwesome / font-awesome-sass

Font-Awesome Sass gem for use in Ruby/Rails projects
MIT License
906 stars 265 forks source link

Updated to version 5.0.6, assets:precompile does not process font-awesome #144

Closed richthedev closed 6 years ago

richthedev commented 6 years ago

Hello ! We upgraded from v4.7.0 to v5.0.6, and since then, running rails assets:precompile does not process font-awesome assets. Has anyone else seen this behavior?

designhunger commented 6 years ago

That's because the fonts are still loaded with url instead of asset-url. Just include the following snippet after integrating font-awesome.

@font-face { font-family: 'Font Awesome 5 Free'; font-style: normal; font-weight: 900; src: asset-url('#{$fa-font-path}/fa-solid-900.eot'); src: asset-url('#{$fa-font-path}/fa-solid-900.eot?#iefix') format('embedded-opentype'), asset-url('#{$fa-font-path}/fa-solid-900.woff2') format('woff2'), asset-url('#{$fa-font-path}/fa-solid-900.woff') format('woff'), asset-url('#{$fa-font-path}/fa-solid-900.ttf') format('truetype'), asset-url('#{$fa-font-path}/fa-solid-900.svg#fontawesome') format('svg'); }

@font-face { font-family: 'Font Awesome 5 Free'; font-style: normal; font-weight: 400; src: asset-url('#{$fa-font-path}/fa-regular-400.eot'); src: asset-url('#{$fa-font-path}/fa-regular-400.eot?#iefix') format('embedded-opentype'), asset-url('#{$fa-font-path}/fa-regular-400.woff2') format('woff2'), asset-url('#{$fa-font-path}/fa-regular-400.woff') format('woff'), asset-url('#{$fa-font-path}/fa-regular-400.ttf') format('truetype'), asset-url('#{$fa-font-path}/fa-regular-400.svg#fontawesome') format('svg'); }

@font-face { font-family: 'Font Awesome 5 Brands'; font-style: normal; font-weight: normal; src: asset-url('#{$fa-font-path}/fa-brands-400.eot'); src: asset-url('#{$fa-font-path}/fa-brands-400.eot?#iefix') format('embedded-opentype'), asset-url('#{$fa-font-path}/fa-brands-400.woff2') format('woff2'), asset-url('#{$fa-font-path}/fa-brands-400.woff') format('woff'), asset-url('#{$fa-font-path}/fa-brands-400.ttf') format('truetype'), asset-url('#{$fa-font-path}/fa-brands-400.svg#fontawesome') format('svg'); }

richthedev commented 6 years ago

That worked for me, maybe it should be added to the readme ?

sicks commented 6 years ago

No, the current release is still mis-referencing the correct files, I suspect it'll be updated soon though.

If you include "font-awesome-sprockets" stylesheet it should indeed use the asset-url helper. see #140 and #142

supercodepoet commented 6 years ago

ok, so sorry about this. This is what I get for trying to update multiple items at once. I have upgraded my tests to catch these types of issues (hopefully). Please try out 5.0.6.2 and let me know if the precompiling and serving issues are fixed. Thanks!