Rails assets not precompiling, css looks different in production

Question

My rails app in dev mode works and looks exactly as I want it to, but in production it looks different on chrome and safari, in safari the logo images loads but not the font, in chrome the font loads but not the image plus the input fields are a little longer and mis-aligned in chrome but in dev mode it all looks great in chrome

I been messing with this for a while and deleted the public/assets a few times a did

rake assets:precompile RAILS_ENV=production 

with no success, the precompile goes through with no errors

config/application.rb:

 # Settings in config/environments/* take precedence over those specified here.
 # Application configuration should go into files in config/initializers
 # -- all .rb files in that directory are automatically loaded.
 config.assets.paths << "#{Rails.root}/assets/fonts"
 config.assets.paths << "#{Rails.root}/assets/images"
 config.assets.paths << Rails.root.join("app", "assets", "fonts")
 config.assets.precompile += %w( .svg .eot .woff .ttf )


# Set Time.zone default to the specified zone and make Active Record auto-convert to this zone.
# Run "rake -D time" for a list of tasks for finding time zone names. Default is UTC.
# config.time_zone = 'Central Time (US & Canada)'

# The default locale is :en and all translations from config/locales/*.rb,yml are auto loaded.
# config.i18n.load_path += Dir[Rails.root.join('my', 'locales', '*.{rb,yml}').to_s]
# config.i18n.default_locale = :de
config.assets.enabled = true  
#config.assets.paths << "#{Rails.root}/app/assets/fonts" 

config/environments/production:

# Code is not reloaded between requests.
config.cache_classes = true

# Eager load code on boot. This eager loads most of Rails and
# your application in memory, allowing both thread web servers
# and those relying on copy on write to perform better.
# Rake tasks automatically ignore this option for performance.
config.eager_load = true

# Full error reports are disabled and caching is turned on.
config.consider_all_requests_local       = false
config.action_controller.perform_caching = true

# Enable Rack::Cache to put a simple HTTP cache in front of your application
# Add `rack-cache` to your Gemfile before enabling this.
# For large-scale production use, consider using a caching reverse proxy like nginx,  varnish or squid.
# config.action_dispatch.rack_cache = true

# Disable Rails's static asset server (Apache or nginx will already do this).
config.serve_static_assets = true
#config.assets.compile = true

config.assets.precompile =  ['*.js', '*.css', '*.css.erb', '*.css.scss'] 
# Compress JavaScripts and CSS.
config.assets.js_compressor = :uglifier
# config.assets.css_compressor = :sass
config.assets.paths << "#{Rails.root}/assets/fonts"
config.assets.paths << "#{Rails.root}/assets/images"
config.assets.precompile += %w( .svg .eot .woff .ttf )
config.assets.paths << Rails.root.join('app', 'assets', 'fonts')
# Do not fallback to assets pipeline if a precompiled asset is missed.
config.assets.compile = false
config.assets.precompile << /(^[^_\/]|\/[^_])[^\/]*$/
# Generate digests for assets URLs.
config.assets.digest = true

# Version of your assets, change this if you want to expire all your assets.
config.assets.version = '1.0'

Answer 1

In your config/environments/production.rb file, set:

config.serve_static_assets = false (currently it's set to true)

config.assets.compile = true (currently it's set to false)

This should solve your problem.

Let me explain what I am asking you to do.

• By setting config.serve_static_assets = false, we are telling rails server, don't add ActionDispatch::Static middleware, which is used to serve static assets.

Why not?

That's because in production environment, you are expected to run your application server (like puma) behind a web server (like Apache/Nginx), which is designed to serve static files (including assets) directly, without bothering to send the request to rails application server.

Since, you are not using any web server, we are turning it off.

• By setting config.assets.compile = true, we are telling rails to compile the requested asset at runtime. i.e. Look for the requested asset in app/assets, vendor/assets, lib/assets and serve it if found from any of these locations.

By default, config.assets.compile is true in development, false in production environment. Since, we are not using web server to serve static assets, we are asking rails to live compile our assets.

For further details refer to the asset pipeline documentation.