tailwind.css not being generated in a Rails 7 project in Heroku

Question

I have a Rails 7 project using TailwindCSS deployed to Heroku that is not building tailwind.css during rake asset:precompile and I don't know why. When I try to access the application, it crashes with this error:

I, [2022-03-23T17:35:18.429029 #8]  INFO -- : [4f6eaac8-942c-4ee5-af10-172663b1a292] Started GET "/" for XX.XX.XX.XX at 2022-03-23 17:35:18 +0000
I, [2022-03-23T17:35:18.433526 #8]  INFO -- : [4f6eaac8-942c-4ee5-af10-172663b1a292] Processing by StaticController#index as HTML
I, [2022-03-23T17:35:18.439133 #8]  INFO -- : [4f6eaac8-942c-4ee5-af10-172663b1a292]   Rendered static/index.html.erb within layouts/application (Duration: 0.6ms | Allocations: 184)
I, [2022-03-23T17:35:18.446294 #8]  INFO -- : [4f6eaac8-942c-4ee5-af10-172663b1a292]   Rendered layout layouts/application.html.erb (Duration: 7.8ms | Allocations: 1205)
I, [2022-03-23T17:35:18.446595 #8]  INFO -- : [4f6eaac8-942c-4ee5-af10-172663b1a292] Completed 500 Internal Server Error in 13ms (Allocations: 2512)
F, [2022-03-23T17:35:18.447716 #8] FATAL -- : [4f6eaac8-942c-4ee5-af10-172663b1a292]
[4f6eaac8-942c-4ee5-af10-172663b1a292] ActionView::Template::Error (The asset "tailwind.css" is not present in the asset pipeline.
):
[4f6eaac8-942c-4ee5-af10-172663b1a292]     12:     <meta name="theme-color" content="#ffffff">
[4f6eaac8-942c-4ee5-af10-172663b1a292]     13:     <%= csrf_meta_tags %>
[4f6eaac8-942c-4ee5-af10-172663b1a292]     14:     <%= csp_meta_tag %>
[4f6eaac8-942c-4ee5-af10-172663b1a292]     15:     <%= stylesheet_link_tag "tailwind", "inter-font", "data-turbo-track": "reload" %>
[4f6eaac8-942c-4ee5-af10-172663b1a292]     16:     <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
[4f6eaac8-942c-4ee5-af10-172663b1a292]     17:     <%= javascript_importmap_tags %>
[4f6eaac8-942c-4ee5-af10-172663b1a292]     18:   </head>
[4f6eaac8-942c-4ee5-af10-172663b1a292]
[4f6eaac8-942c-4ee5-af10-172663b1a292] app/views/layouts/application.html.erb:15

I actually have two projects that are set up pretty much identically (they have different functionality though) and the other one works.

I have added

config.assets.css_compressor = nil

to production.rb, test.rb and development.rb (just in case).

I'm installing the latest tailwindcss-rails at the time of this writing, 2.0.8. I'm also installing sassc-rails because it's needed for rails_admin but that's also true for the other project where that is needed.

Here's the curious thing. If I open a console to that Heroku project and run rake asset:precompile it actually finishes creating the missing files:

~ $ rake assets:precompile
+ /app/vendor/bundle/ruby/3.1.0/gems/tailwindcss-rails-2.0.8-x86_64-linux/exe/x86_64-linux/tailwindcss -i /app/app/assets/stylesheets/application.tailwind.css -o /app/app/assets/builds/tailwind.css -c /app/config/tailwind.config.js --minify

Done in 821ms.
W, [2022-03-19T12:38:43.514430 #6]  WARN -- : Removed sourceMappingURL comment for missing asset 'rails_admin/popper.js.map' from /app/vendor/bundle/ruby/3.1.0/gems/rails_admin-3.0.0.rc4/vendor/assets/javascripts/rails_admin/popper.js
W, [2022-03-19T12:38:43.534443 #6]  WARN -- : Removed sourceMappingURL comment for missing asset 'rails_admin/bootstrap.js.map' from /app/vendor/bundle/ruby/3.1.0/gems/rails_admin-3.0.0.rc4/vendor/assets/javascripts/rails_admin/bootstrap.js
I, [2022-03-19T12:38:43.744157 #6]  INFO -- : Writing /app/public/assets/tailwind-0c01c3e907ab268dbd4dcaa14542a12d0388cfbeb5733a183e88e1b26ef30afb.css
I, [2022-03-19T12:38:43.744385 #6]  INFO -- : Writing /app/public/assets/tailwind-0c01c3e907ab268dbd4dcaa14542a12d0388cfbeb5733a183e88e1b26ef30afb.css.gz
~ $

Why didn't that work during deployment? I can see it's running it:

       Using stimulus-rails 1.0.4
       Using tailwindcss-rails 2.0.8 (x86_64-linux)
       Bundle complete! 28 Gemfile dependencies, 90 gems now installed.
       Gems in the groups 'development' and 'test' were not installed.
       Bundled gems are installed into `./vendor/bundle`
       Bundle completed (0.38s)
       Cleaning up the bundler cache.
       Removing bundler (2.2.33)
-----> Detecting rake tasks
-----> Preparing app for Rails asset pipeline
       Running: rake assets:precompile
       
       Done in 788ms.
       Asset precompilation completed (3.58s)
       Cleaning assets
       Running: rake assets:clean
-----> Detecting rails configuration
-----> Discovering process types
       Procfile declares types     -> release, web, worker
       Default types for buildpack -> console, rake
-----> Compressing...
       Done: 78.7M
-----> Launching...

Uno

Check you command? guides.rubyonrails.org/asset_pipeline.html#precompiling-assets – Typhoid

@Nuclearman: what do you mean by check? if I'm running the right command? Heroku runs it automatically, I don't have control over it. – Uno

Answer 1

I found the problem:

At some point I removed app/assets/builds/.keep from the project which causes the app/assets/build directory to not be created when git cloning the repo. I don't understand why that causes tailwind.css to not be created on the first run, but it is created on the second run of rake assets:precompile.

Reported it as a bug just in case: https://github.com/rails/tailwindcss-rails/issues/158

Uno

Thank you very, very much! I already spent 3 days looking for a solution, and you saved me! – Dogberry

Answer 2

rails assets:clean assets:precompile

this command resolved helped me to resolved this issue.

Bedard

It also worked for me! Thax! – Mill

Do you run that locally, or do you have to run that from the heroku side? – Torn

@Torn Run it on heroku server. – Bedard

@JigarBhatt How do you do that (as in, how do you run that command from the heroku server)? – Torn

Login to heroku server by using CMD and try these commands. – Bedard

Answer 3

Try running the following commands on your local machine:

gem install bundler
bundle update --bundler
bundle lock --add-platform x86_64-linux

Then commit these changes, and deploy again.

Artur

I've run that, it's still failing with the same error. – Uno

Answer 4

For anyone who faces this problem again, just set the following in your config/environments/development.rb and restart the server

config.assets.debug = true

What this does is it uncovers any asset issues you have in development, with some suggestions on how to fix them.

If you fix the issues it reports, you won't have any asset issues in production as well! (yes, it also reports any potential issues you will have in prod)

Dm