edouard

Joined

1,350 Experience
6 Lessons Completed
1 Question Solved

Activity

Posted in Page blinking when using tailwindcss

In fact, if you go to production assets are compiled and you won't noticed this blinking.

Solved!

Posted in Page blinking when using tailwindcss

Hello guys,

I am trying to use tailwindcss on a 5.2 ruby on rails application with webpack. Everything is set up and works well according to the video How to use Tailwind CSS with Rails. Except a tiny problem that prevent me from putting the app on production.

When pages are loaded, I first see the page without css during less than half a second and then the css is applied and everything goes back to normal.

Here are some captures:
https://drive.google.com/open?id=1S-avtXM_evSxi9gjrEpiXErOioL-QZQ7
https://drive.google.com/open?id=13nWnTcdTgQYqOlv9-AgreqYyHKDOruA9

I thought it was because the tags in the layout where too low so I moved them to the top like that:

<!DOCTYPE html>
<html>
  <head>
    <%= javascript_pack_tag 'application' %>
    <%= stylesheet_pack_tag 'application', media: 'all' %> <!-- Uncomment if you import CSS in app/javascript/packs/application.js -->
    <%= stylesheet_link_tag 'application', media: 'all' %>
    <meta charset="UTF-8">

It reduces a little the blinking but I can still see it.

NB: The app is light (only 3 pages more or less, nothing fancy with big video/img...)
NB: I am a really big fan of tailwindcss that's why I want it to work!

And I just looked at the new video for tailwincss 1 beta with rails 6 and I have the impression, that Chris has the same thing:
https://drive.google.com/open?id=1SA2wXdVuM8xLoinPXnbD4bj_VI4BL-9n

@Chris, is it true?

I don't understand why. Any help is more than welcome: I am really stucked!
Tell me if you need any other information.

Thank you for your help!