s2k

s2k

Author of Fast Feedback Using Ruby

Agile Web Development with Rails 7: Reloading assets in development mode

Hi all,

currently I wonder how the Tailwind colours work (or don’t work).

For example, in app/views/layouts/application.html.erb I have this:

<header class="bg-green-600">

and, yes, the header part is indeed green.

But when I change it to, for example

<header class="bg-sky-600">

and reload the page, the background is white. Why is that?
I assumed the examples from the Tailwind docs at http://tailwindcss.com/docs/background-color, can be used elsewhere (read: my local app).
And while that’s true from some of the named colours, it is not for others.
‘bg-blue-700’ yields a strong blue, ‘bg-orange-500’ & ‘bg-fuchsia-600’ is white. A ‘one-off’ colour is also displayed white (or ignored?).

After running

bin/rails assets precompile

these colours are displayed in the browser.
What causes this behaviour? Can it be changed, to get all the colours Tailwind has in store (e.g. also the ‘one-off’ colours such as class="bg-[#50d71e]" (also from the Tailwind docs)?

Cheers
Stephan

Marked As Solved

s2k

s2k

Author of Fast Feedback Using Ruby

Aha, now I see were I went wrong: While, I usually default to using Foreman, I used bin/rails server, which doesn’t watch for Tailwind related changes, while the Procfile.dev does.

It’s nice that bin/dev even installs foreman if it isn’t already there.

Also Liked

rubys

rubys

Author of Agile Web Development With Rails

Short answer: stop your server, run rails assets:clobber, and restart your server.

I guess the question I have to ask: why did you run bin/rails assets:precompile? What that does is to create a static snapshot of your tailwind classes and put the results into your public/assets directory. If that directory exists when the server is started, puma will serve those files and never forward the request to rails at all. The end result is any tailwind classes you try to make use of will be ignored unless they are in that static snapshot.

rubys

rubys

Author of Agile Web Development With Rails

What I did to reproduce the problem:

rails new play --css tailwind
cd play
rails generate scaffold say hello
bin/dev

Adding bg-green-600 to app/views/say/hello.html.erb worked at this point.

Stopping the server, running rails assets:precompile, restarting the server, and then changing the color to bg-sky-600 did not work - the background was white – this matched what you reported.

Stopping the server, running rails assets:clobber, and restarting the server, and I can see the new color. I can then change the color to bg-red-600 and see the results of my change.

Popular Prag Prog topics Top

kuroneko
Whilst the author has been careful to provide exact results for the tests elsewhere in the book (such as surds with the transformation te...
New
telemachus
Python Testing With Pytest - Chapter 2, warnings for “unregistered custom marks” While running the smoke tests in Chapter 2, I get these...
New
jdufour
Hello! On page xix of the preface, it says there is a community forum "… for help if your’re stuck on one of the exercises in this book… ...
New
New
leba0495
Hello! Thanks for the great book. I was attempting the Trie (chap 17) exercises and for number 4 the solution provided for the autocorre...
New
brian-m-ops
#book-python-testing-with-pytest-second-edition Hi. Thanks for writing the book. I am just learning so this might just of been an issue ...
New
brunogirin
When I run the coverage example to report on missing lines, I get: pytest --cov=cards --report=term-missing ch7 ERROR: usage: pytest [op...
New
brunogirin
When installing Cards as an editable package, I get the following error: ERROR: File “setup.py” not found. Directory cannot be installe...
New
hazardco
On page 78 the following code appears: &lt;%= link_to ‘Destroy’, product, class: ‘hover:underline’, method: :delete, data: { confirm...
New
mcpierce
@mfazio23 I’ve applied the changes from Chapter 5 of the book and everything builds correctly and runs. But, when I try to start a game,...
New

Other popular topics Top

PragmaticStudio
Let’s get real. As in really knowing—clearly and practically—what’s up with Phoenix LiveView. What is it? How does it work? What can I ...
New
wolf4earth
@AstonJ prompted me to open this topic after I mentioned in the lockdown thread how I started to do a lot more for my fitness. http://f...
New
PragmaticBookshelf
A PragProg Hero’s Journey with Brian P. Hogan @bphogan Have you ever worried that your only legacy will be in the form of legacy...
New
Exadra37
Please tell us what is your preferred monitor setup for programming(not gaming) and why you have chosen it. Does your monitor have eye p...
New
AstonJ
Curious to know which languages and frameworks you’re all thinking about learning next :upside_down_face: Perhaps if there’s enough peop...
New
New
Exadra37
I am a Linux user since 2012, more or less, and I always use Ubuntu on my computers, and my last 2 laptops have been used Thinkpads, wher...
New
PragmaticBookshelf
“Finding the Boundaries” Hero’s Journey with Noel Rappin @noelrappin Even when you’re ultimately right about what the future ho...
New
AstonJ
Saw this on TikTok of all places! :lol: Anyone heard of them before? Lite:
New
AstonJ
If you’re getting errors like this: psql: error: connection to server on socket “/tmp/.s.PGSQL.5432” failed: No such file or directory ...
New

Latest in PragProg

View all threads ❯