'Tailwind with Angular 13

when I run : ng add @ngneat/tailwind

I got this error: An unhandled exception occurred: NOT SUPPORTED: keyword "id", use "$id" for schema ID !!!!!!

VSCode.

Angular cli v: 13.1.2

npm v: 8.3.0

node v: 17.2.0

Win 10 64

Solution 1:^[1]

This is an open issue over at the people of ngneat and needs to be resolved by them as well.

I will share the hotfix provided in the linked issue. All credits to kingjordan:

Thanks to @kingjordan for his solution.

Install the dependencies:

npm install tailwindcss@latest @ngneat/tailwind@latest

Create a configuration file for Tailwind CSS at the root of your workspace:

npx tailwindcss init

Add purge configurations:

module.exports = {
  ...
  purge: {
    enabled: guessProductionMode(),
    content: [ "<path/to/project/**/*.{html, ts, jsx, etc}>" ],
  },
  ...
}

Import Tailwind CSS styles into the root styles file of your project.

@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

Solution 2:^[2]

Just try to use the steps of tailwind install for angular version less then 11.2.0

Solution 3:^[3]

Install Tailwind CSS with Angular

https://tailwindcss.com/docs/guides/angular

Tailwind is now officially supported by angular so no need to rely on community supported @ngneat/tailwind Package.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Philipp Meissner
Solution 2
Solution 3	sudhagar murugesan

'Tailwind with Angular 13

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]