Support tailwind v4

[heddendorp]

Command

build

Description

Tailwind v4 is changing the installation and configuration. It would be great to update the cli to make sure v4 is supported.

Describe the solution you'd like

The cli should support the new postcss plugin https://tailwindcss.com/docs/v4-beta#installing-with-post-css
Also detection probably has to be changed as v4 no longer uses js to configure tailwind but instead css variables https://tailwindcss.com/docs/v4-beta#installing-with-post-css
I guess the best detection at this point is having tailwindcss with a version >4 installed and ideally the cli also makes sure @tailwindcss/postcss is installed.

Describe alternatives you've considered

Tailwind also offers a vite plugin, but to my understanding, postcss should be easier to support

[clydin]

Custom postcss configurations are possible with the application build system (default for all new projects). The @tailwindcss/postcss plugin can be used directly by creating a postcss.config.json/.postcssrc.json file and including the plugin.

As tailwindcss v4 moves towards a stable release, we are also evaluating direct inclusion of the optimized pipeline present in the Vite plugin to avoid the need for postcss if preferred.

[pumano]

@clydin looks like vite plugin should be more performant than postcss. If lightingcss will be used under the hood of vite, it's more performant

[dcheglakov]

@clydin I’ve tried following your approach with the postcss.config.json file and enabling Tailwind CSS via PostCSS like this:

{
  "plugins": {
    "@tailwindcss/postcss": {}
  }
}

for my Angular 16 project. Unfortunately, it didn’t resolve the issue for me. Maybe there’s something specific to Angular 16 that I might be missing? Thank you.

[clydin]

Custom postcss configuration is only supported with the application build system in v17.2 or higher.

Angular v16 is also no longer supported. Please consider upgrading to a newer and supported version.

[JoepKockelkorn]

I can confirm the postcss.config.json approach works. I did have to install tailwind and its postcss plugin using --legacy-peer-deps due to conflicts.