Does Primeng 19 support Tailwind 4.0.0?

[junan-trustarc]

I was trying to install tailwind 4.0.0 but I can't make it working on PrimeNg19, it only works with the previous version which is 3.4.x.
Could someone verify? if not when could it be supported?

[SiebeDom]

We are also adding Tailwind 4.0.0 to our projects.

Except for 2 small issues it's going fine, but we are not finished yet.

As mentioned here: angular/angular-cli#28938 (comment) Angular is still locked to version 2 or 3.

In the Tailwind installation instructions they say to use --force
https://tailwindcss.com/docs/installation/framework-guides/angular

To avoid saying --force every time when doing npm install.

We added this to our package.json:
"overrides": { "tailwindcss": "^4.0.0", "@tailwindcss/postcss": "^4.0.0" }
When Angular adds Tailwind 4.0.0 to its peerDeeps we will remove this config.

Another issue we had was with PrimeIcons (it was not finding the url of the fonts) when we used the instructions on.
https://primeng.org/icons
When adding adding the primeicons.css in Angular.json (instead of @import in the styles.css) it works.
"styles": [ "src/styles.css", "node_modules/primeicons/primeicons.css" ],

When using @import in the css file we got this error during build:

X [ERROR] Could not resolve "./fonts/primeicons.eot" [plugin angular-css-resource]
src/styles.css:539:11:
539 │ src: url('./fonts/primeicons.eot');
╵ ~~~~~~~~~~~~~~~~~~~~~~~~
X [ERROR] Could not resolve "./fonts/primeicons.eot?#iefix" [plugin angular-css-resource]
src/styles.css:540:11:
540 │ src: url('./fonts/primeicons.eot?#iefix') format('embedded-open...
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
X [ERROR] Could not resolve "./fonts/primeicons.woff2" [plugin angular-css-resource]
src/styles.css:540:77:
540 │ ...d-opentype'), url('./fonts/primeicons.woff2') format('woff2'),...
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~
X [ERROR] Could not resolve "./fonts/primeicons.woff" [plugin angular-css-resource]
src/styles.css:540:126:
540 │ ...rmat('woff2'), url('./fonts/primeicons.woff') format('woff'), ...
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~
X [ERROR] Could not resolve "./fonts/primeicons.ttf" [plugin angular-css-resource]
src/styles.css:540:173:
540 │ ...ormat('woff'), url('./fonts/primeicons.ttf') format('truetype'...
╵ ~~~~~~~~~~~~~~~~~~~~~~~~
X [ERROR] Could not resolve "./fonts/primeicons.svg?#primeicons" [plugin angular-css-resource]
src/styles.css:540:223:
540 │ ...etype'), url('./fonts/primeicons.svg?#primeicons') format('svg');
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

[lssteiner]

using @use instead of @import in src/styles.scss resolves the primeicons font issue
(@import is deprecated in sass in favour of @use - which has better scoping)

src/styles.scss:

@use "primeicons/primeicons.css" as *;

@use "tailwindcss";

[vitorlopez]

What about the "tailwindcss-primeui" plugin that's required for the tailwind.config.js (which doesn't exist anymore)