[Bug]: live reload rebuild twice when using tailwind watch

See original GitHub issue

Which Remix packages are impacted?

remix (Remix core)
create-remix
@remix-run/architect
@remix-run/cloudflare-workers
@remix-run/dev
@remix-run/express
@remix-run/netlify
@remix-run/node
@remix-run/react
@remix-run/serve
@remix-run/server-runtime
@remix-run/vercel

What version of Remix are you using?

1.0.6

Steps to Reproduce

Follow the styling section for tailwindcss in remix doc

Expected Behavior

live reload ignore the generated css file change

Actual Behavior

[1] 💿 File changed: app/styles/app.css [1] 💿 Rebuilding… [1] 💿 Rebuilt in 226ms [1] GET /form 200 - - 31.452 ms [1] 💿 File changed: app/styles/app.css [1] 💿 Rebuilding… [1] 💿 Rebuilt in 170ms

Issue Analytics

State:
Created 2 years ago
Comments:27 (12 by maintainers)

Top GitHub Comments

6reactions

kentcdoddscommented, Nov 29, 2021

There we go 😃 https://github.com/postcss/postcss-cli/pull/417

4reactions

kentcdoddscommented, Dec 10, 2021

My PR was merged into postcss-cli!

If you update your version to 9.1.0 or greater you should no longer get a double-refresh when you save a file unless you actually do change the CSS (like in the Tailwind JIT case, if you change the class name on an element). In that case you’ll still get the double-reload. @ryanflorence had some ideas of how to avoid that once and for all. But the nice this is with postcss-cli 9.1.0 you’ll no longer get an unnecessary rebuild 😃

Top Results From Across the Web

Just-in-Time Mode - Tailwind CSS

If your CSS isn't rebuilding when you change your content files, try setting TAILWIND_MODE=watch as part of your watch script to tell Tailwind...

Tailwind not automatically updating styles without npm run ...

I'm following a course on Udemy and I've gone over every step twice but mine just isn't working like it is in the...

Debugging Tailwind CSS and Next.js - LogRocket Blog

Using Tailwind CSS and Next.js together can be a powerful match, sometimes a few bugs get in the way. Learn to fix them...

Adding Tailwind CSS to Phoenix 1.6 - The Pragmatic Studio

The Tailwind CLI tried to use the intermediate app.css.tailwind file as input, but it didn't yet exist because DartSass ran after Tailwind.

Using Tailwind CSS with Create React App - Dave Ceddia

The watch:tailwind script will re-build the Tailwind output file when any CSS or SCSS files under the src directory are changed. It's explicitly ......