Rails assets compile, but nothing changes

You open your Rails project, execute bin/dev, and start making changes to the CSS.

But nothing seems to happen.

You check the console and find a log from esbuild indicating that the assets have been compiled. It appears to be cached. You then run bin/rails tmp:clear, change some CSS and save, compile again…

Still, nothing changes.

Solution

If you run

bin/rails assets:clobber

and then restart the application, you may find that changes start to take effect once more, just as intended.

If this resolves the issue, it suggests that the assets weren’t updating previously because precompiled assets were in place. Rails was prioritizing these precompiled assets over those from development, and these precompiled assets are not treated as cache.

What are the difference among clear commands?

In a rails project there is a ton of ways to clean things, the commands you have also depend on the things you installed, some are

bin/rails tmp:clear
Clear cache, socket and screenshot files from tmp/

bin/rails dev:cache
Toggles the use of cache for development enviroment.

bin/rails log:clear
Truncates all/specified *.log files in log/ to zero bytes. Essentially, It removes everthing from the file but doesn’t the file itself. You can specify the logs you desire to reset with
LOGS=test,development bin/rails log:clear.

bin/rails assets:clean
In old versions, this command removed all the assets. However, it now removes old assets while retaining the last three versions.

bin/rails db:schema:cache:clear
On boot rails queries the details of all tables. Running the command removes the cache file for it.

It’s not used by default, and it’s distinct from db/schema.rb. The cache file is db/schema_cache.yml, being used if exists. You can create It with bin/rails db:schema:cache:dump.

Cloberring

Clobbering for software refers to overwriting the whole content of a file and is often used to refer to complete uninstalls

bin/rails assets:clobber
removes everthing from public/assets

Since assets clobber just remove everthing from public/assets, one might expect similar behavior from other “clobber” commands. tailwindcss:clobber to delete public/assets/tailwind-{hash}.css and so on. However, this isn’t exactly what happens. The following commands act on files within app/assets/builds. This directory is used for your assets if you don’t precompile them or if you simply run bin/rails css:build, and so forth.

bin/rails tailwindcss:clobber
remove all the css files from app/assets/builds

bin/rails css:clobber
same thing, remove all the css files from app/assets/builds

bin/rails javascript:clobber
remove all the js files from app/assets/builds