README
FormlyTailwindcss
Installation
Create a new Angular app or use your existing one.
- Install TailwindCSS and Forms plugin
# select forms plugin
ng add ngx-tailwind
# alternative install via
npm install -D @tailwindcss/forms
- Install Formly
ng add @ngx-formly/schematics
- Install Formly TailwindCSS theme
npm i @notiz/formly-tailwindcss
- Import
FormlyTailwindcssModule
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { ReactiveFormsModule } from '@angular/forms';
import { FormlyModule } from '@ngx-formly/core';
import { FormlyTailwindcssModule } from '@notiz/formly-tailwindcss';
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
AppRoutingModule,
ReactiveFormsModule,
FormlyModule.forRoot({ extras: { lazyRender: true } }),
FormlyTailwindcssModule,
],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
- Add Tailwind purge path
'./node_modules/@notiz/formly-tailwindcss/esm2015/**/*.js'
Tailwind purge
Usage | Purge Path |
---|---|
@notiz/formly-tailwindcss |
'./node_modules/@notiz/formly-tailwindcss/esm2015/lib/**/*.js' |
@notiz/formly-tailwindcss/layouts |
'./node_modules/@notiz/formly-tailwindcss/esm2015/layouts/**/*.js' |
both | './node_modules/@notiz/formly-tailwindcss/esm2015/**/*.js' |