font_url not working with asset_hash
nlsrchtr opened this issue · comments
I would like to use a custom font and hashed assets. So I set up something like:
@font-face {
font-family: "my-custom-font";
src: font_url("my-custom-font.eot");
src: font_url("my-custom-font.eot?#iefix") format("embedded-opentype"),
font_url("my-custom-font.woff") format("woff"),
font_url("my-custom-font.ttf") format("truetype"),
font_url("my-custom-font.svg#my-custom-font") format("svg");
font-weight: normal;
font-style: normal;
}If I reload, the generated CSS only contains one hashed asset url, f.e.:
@font-face {
font-family: "my-custom-font";
src: url("/fonts/my-custom-font-66bffac9.eot");
src: url("my-custom-font-66bffac9.eot?#iefix") format("embedded-opentype"),
url("/fonts/my-custom-font.woff") format("woff"),
url("/fonts/my-custom-font.ttf") format("truetype"),
url("/fonts/my-custom-font.svg#my-custom-font") format("svg");
font-weight: normal;
font-style: normal;
}If I put some other font in the first place, it also gets the correct hash attached. Does anyone have an idea what is happening and how this can be improved? This is suboptimal since specially custom fonts will change and so the outdating of the cached file with the hash seems necessary for me.
Thanks for any hint!
What is font_url? Do you mean compass' font-url?
Judging by the output, it does not look like that function is being run.
Are you on v4? Try adding middleman-compass to your Gemfile if you're expecting compass functions.
Hi @tdreyno, thank for your feedback. The method I'm referring to is part of the middleman core app at renderers/sass_functions.rb.
The function is being run on the first usage of font_url on each line, but not on further calls.
I updated the code examples, because I had a copy & paste error, which lead to the impression, that it's not called at all
@nlsrchtr Ah, yeah, we ported that out of Compass for v4. I forgot :)
Does this issue only happen when Sprockets is involved? Can you remove/comment the sprockets line from your Gemfile and confirm this is still happening?
Yes, it's only happening if Sprockets is involved. So the combination font_url, Sprockets and asset hash is causing the issue. Should I wait for a final asset pipeline in v4, since the docs suggesting the external_asset pipelines?
Thanks for looking into it, @tdreyno!
Sprockets is likely not coming to v4 for a long time, unless we find a maintainer.
@nlsrchtr It may even be possible to use Sprockets CLI with the external pipeline:
https://github.com/rails/sprockets/blob/master/bin/sprockets
(to be clear, I think external pipeline is much better than bundling sprockets, since the external pipeline allow more flexibility)
That's a good thought. Looks like this CLI doesn't provide a watcher, so it'll likely be quite slow.
I was trying to get a quick win and changed font_url into image_url but it also failed. What's the new supported way for v4 if I was used to the rails-style asset pipeline behaviour?
For now, Compass will provide those methods still. That said, I'd just use normal url with a project absolute path: /fonts/my-font.ttf. v4 can parse these and relativize them if asset_hash is active.