Tailwindcss causes Vue2 project to stuck and stopped

[yaowangmx]

What version of Tailwind CSS are you using?

"tailwindcss": "npm:@tailwindcss/postcss7-compat"

What build tool (or framework if it abstracts the build tool) are you using?

vue-cli 4.5.0

What version of Node.js are you using?

v16

What browser are you using?

Chromium 134.0.6998.178

What operating system are you using?

win10

When I removed Tailwind, the page was very smooth

After investigation, it was found that I introduced @ tailwind utilities in tailwindcss.css;

[philipp-spiess]

Hey! The screenshot you pasted appears to be Tailwind CSS v3 code but you said that you're using v4. Might be good to check out the upgrade guide: https://tailwindcss.com/docs/upgrade-guide

[yaowangmx]

Hey! The screenshot you pasted appears to be Tailwind CSS v3 code but you said that you're using v4. Might be good to check out the upgrade guide: https://tailwindcss.com/docs/upgrade-guide

Yes，I'm using tailwindcss@2.2.17.

[yaowangmx]

When I import utilities.css separately, the page is also stuck. When I only keep @media (min-width: 1280px) in utilities.css, the page is not stuck. Or is the reason that the style sheet imported by @tailwind utilities is too large?

[yaowangmx]

The problem has been solved, I added mode: 'jit' in tailwind.config.js