Rails asset pipeline: custom font does not load (hash not appended to file name in compiled CSS)

Question

I have the following SASS code to load a custom font:

@font-face
  font-family: 'Fredericka the Great'
  font-style: normal
  font-weight: 400
  src: local('Fredericka the Great'), local('FrederickatheGreat'), asset-url('assets/fredericka_the_great.woff2') format('woff2')
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215

In development, it loads fine.

On one of my servers, it does not. Looking closer at the produced code, I noticed that in the compiled CSS, there is no hash appended where the woff-file should be loaded:

@font-face{
  font-family:"Fredericka the Great";
  font-style:normal;
  font-weight:400;
  src:local("Fredericka the Great"),local("FrederickatheGreat"),url(/assets/fredericka_the_great.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215}

As you can see, the compiled code produces url(/assets/fredericka_the_great.woff2), while on the server, the deployed assets look like this:

So in my opinion, the CSS should produce url(/assets/fredericka_the_great-49badd2a1e856a1d9e3a6cb6189f0426bda9f2b292376395758419c2d0c631b6.woff2). In fact, trying to load the file manually works:

• Works: http://staging-audit.access4all.ch.zugangfueralle01.nine.ch/assets/fredericka_the_great-49badd2a1e856a1d9e3a6cb6189f0426bda9f2b292376395758419c2d0c631b6.woff2
• Does not work: http://staging-audit.access4all.ch.zugangfueralle01.nine.ch/assets/fredericka_the_great.woff2

What's interesting though is the fact that on some other server, the same application works as expected (which seems weird, as the CSS there also lacks the hash)!

• Works: http://audit.uber.space/assets/fredericka_the_great-49badd2a1e856a1d9e3a6cb6189f0426bda9f2b292376395758419c2d0c631b6.woff2
• Works, too: http://audit.uber.space/assets/fredericka_the_great.woff2

(For closer CSS-inspection, go to https://audit.uber.space/assets/application-9e5ba30be64b818da5468c9b39dc20aafa0ce523315d3e6684b96d11e336f603.css - or, funnily enough, just https://audit.uber.space/assets/application.css)

What makes me VERY suspicious is the fact that when I rename the woff-file on the server to something completely different, the file is still being loaded by the website. So probably the server doesn't even send the compiled woff-file, but some completely different woff-file (maybe directly from a gem directory or something)...?

I'm unsure how to proceed now, as I don't know what's the expected behaviour, and how to fix my deployment.

For the sake of completeness, here's the config of my deployment (I use mina):

$ mina -d

------- Printing current config variables -------
:debug_configuration_variables => true
:port => 22
:releases_path => #<Proc:0x007fc881157470@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-1.2.3/tasks/mina/deploy.rb:3 (lambda)>
:shared_path => #<Proc:0x007fc881157380@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-1.2.3/tasks/mina/deploy.rb:4 (lambda)>
:current_path => #<Proc:0x007fc8811572b8@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-1.2.3/tasks/mina/deploy.rb:5 (lambda)>
:lock_file => "deploy.lock"
:deploy_script => "data/deploy.sh.erb"
:keep_releases => 5
:version_scheme => :sequence
:execution_mode => :pretty
:bundle_bin => "bundle"
:bundle_path => "vendor/bundle"
:bundle_withouts => "development test"
:bundle_options => #<Proc:0x007fc8802da898@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-1.2.3/tasks/mina/bundler.rb:6 (lambda)>
:shared_dirs => ["vendor/bundle", "log", "tmp/cache", "public/assets", "public/uploads", "tmp/sockets", "tmp/pids"]
:rails_env => "production"
:bundle_prefix => #<Proc:0x007fc8802cbeb0@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-1.2.3/tasks/mina/rails.rb:5 (lambda)>
:rake => #<Proc:0x007fc8802bbb50@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-1.2.3/tasks/mina/rails.rb:6 (lambda)>
:rails => #<Proc:0x007fc8802bb970@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-1.2.3/tasks/mina/rails.rb:7 (lambda)>
:compiled_asset_path => "public/assets"
:asset_dirs => ["vendor/assets/", "app/assets/"]
:migration_dirs => ["db/migrate"]
:branch => "master-nine"
:remove_git_dir => true
:remote => "origin"
:git_not_pushed_message => #<Proc:0x007fc88021ab10@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-1.2.3/tasks/mina/git.rb:6 (lambda)>
:web_server => :puma
:puma_role => #<Proc:0x007fc8800e7a90@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:7 (lambda)>
:puma_env => #<Proc:0x007fc8800e77c0@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:8 (lambda)>
:puma_config => #<Proc:0x007fc8800e7590@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:9 (lambda)>
:puma_socket => #<Proc:0x007fc8800e73d8@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:10 (lambda)>
:puma_state => #<Proc:0x007fc8800e7248@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:11 (lambda)>
:puma_pid => #<Proc:0x007fc8800e7108@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:12 (lambda)>
:puma_cmd => #<Proc:0x007fc8800e6e10@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:13 (lambda)>
:pumactl_cmd => #<Proc:0x007fc8800e6d20@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:14 (lambda)>
:pumactl_socket => #<Proc:0x007fc8800e6988@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:15 (lambda)>
:puma_root_path => #<Proc:0x007fc8800e65c8@/Users/josh/.rvm/gems/ruby-2.4.1@XXX/gems/mina-puma-1.1.0/lib/mina/puma/tasks.rake:16 (lambda)>
:rvm_use_path => "$HOME/.rvm/scripts/rvm"
:application_name => "A4AA 2.0"
:domain => "zugangfueralle01.nine.ch"
:deploy_to => "XXX"
:repository => "XXX"
:user => "www-data"
:forward_agent => true
:puma_port => 3006
:shared_files => ["config/secrets.yml"]

Answer 1

I ran in to the same issues couple month's ago and you pretty have so much going on. This is the way I resolved it:

1.- The route, first thing is first. The best way is to save in to app -> assets -> fonts (You create this folder). Then I recommend adding there your font file (.woff) in a way it's readable.

2.- The SASS I specially had to add this code in to my application.scss or custom.scss

@font-face {
    font-family: 'Theola Kids Regular';
    font-style: normal;
    font-weight: normal;
    src:font-url('theola-kids.woff');
    src:font-url('theola-kids.woff') format('woff');
} 

Noticed the src:font-url, it tells rails to find a specific font file. I have two one as a route and the other a route format file.

3.- The Pipline

Be sure to add "fonts" to the application.rb file Example: config.assets.paths << Rails.root.join("app", "assets", "fonts") When finish restart your rails server and check it out. It must work with this solution.

For more details I highly recommend this article: https://gist.github.com/anotheruiguy/7379570

Good luck!