Angular tests doesn't work

[mohamedsennia]

Hello, i've an angular v19 project using tailwind v4 , it works all fine, but when i try to run tests i'm getting an error
An unhandled exception occurred: It looks like you're trying to use tailwindcssdirectly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install@tailwindcss/postcss and update your PostCSS configuration.
is there a solution for this or a way arrround it ?

[docaohuynh]

I see doc here Setting up Tailwind CSS in an Angular project.

But I still got error when run ng test projectName

[mohamedsennia]

Same with me

[martonsimon]

File: node_modules@angular-devkit\build-angular\src\tools\webpack\configs\styles.js
Inside the getStylesConfig(), change this:

if (tailwindPackagePath) {
  extraPostcssPlugins.push(require(tailwindPackagePath)({ config: tailwindConfigPath }));
}

to this:

if (tailwindPackagePath) {
  extraPostcssPlugins.push(require('@tailwindcss/postcss')({ config: tailwindConfigPath }));
}

[dsebata]

I had to use ng test lib --builder-mode=application --watch=false and set src/styles.scss and "inlineStyleLanguage": "scss", in angular.json

{
  "test": {
      "builder": "@angular-devkit/build-angular:karma",
      "options": {
        "tsConfig": "projects/components/tsconfig.spec.json",
        "inlineStyleLanguage": "scss",
        "styles": [
          "src/styles.scss"
        ]         
      }
  }
}

[rozsazoltan]

• How to fix Tailwind PostCSS plugin error?
• Cannot build frontend using Vite, TailwindCSS with PostCSS