Add Tailwind CSS to your Angular project
Simple Angular schematic that initializes Tailwind CSS in your project and adds a custom webpack config to your build process.
Installation
Run
ng add @garygrossgarten/ngx-tailwind
or optionally
ng add @garygrossgarten/ngx-tailwind --project <MY_PROJECT>
Additional options
You can pass additional flags to customize the schematic. For example, if you want to install a different version for Tailwind use --tailwindVersion
flag:
ng add @garygrossgarten/ngx-tailwind --tailwindVersion 1.6.2
All available flags:
Flag | Description | Type | Default |
---|---|---|---|
project
|
The project to initialize with Tailwind CSS. | string |
First Angular project |
skipTailwindInit
|
Skip initializing Tailwind. | boolean |
false |
tailwindVersion
|
The Tailwind version to be installed. | string |
latest |
Developing
Install @angular-devkit/schematics-cli
to be able to use schematics
command
npm i -g @angular-devkit/schematics-cli
Now build the schematics and run the schematic.
npm run build
# or
npm run build:watch
# dry-run in angular-workspace
npm run start:dev
# execute schematics in angular-workspace
npm run start