ng-tailwindcss | CLI tool for integrating Tailwind CSS | Continuous Deployment library

Install globally: npm i ng-tailwindcss -g. If you don't already have an angular project up and running, start your angular project (assumes angular cli is already installed globally): ng new angular-meets-tailwind.
Install globally: npm i ng-tailwindcss -g
If you don't already have an angular project up and running, start your angular project (assumes angular cli is already installed globally): ng new angular-meets-tailwind
Follow Steps 1-3 from the Tailwind Installation Instructions: Install Tailwind (npm i tailwindcss -D) initialize (npx tailwind init) Use tailwind in your source css files. A recommendation for new projects (no changes to global stylesheet yet) is to touch src/tailwind.css and use that file for all global styles and component classes. See Configuration section for existing projects.
Configure your tailwind source/destination/config files by running: ngtw configure --config ./path/to/whatever-you-named-tailwind-config.js --source ./path/to/your-tailwind-source.css --output ./path/to/outputted-global-styles.css This will result in an ng-tailwind.js file at your project's root: module.exports = { // Tailwind Paths configJS: '/Absolute/path/to/whatever-you-named-tailwind-config.js', sourceCSS: '/Absolute/path/to/your-tailwind-source.css', outputCSS: '/Absolute/path/to/outputted-global-styles.css', watchRelatedFiles: [], // Sass sass: false, // PurgeCSS Settings ... } Please note that as of version 1.0.3, these paths will be absolute when created using the cli tool, though they can be manually edited to be relative paths with no adverse consequences. For those curious, under the hood, these properties correspond to the paths used in the tailwind build command like so: ./node_modules/.bin/tailwind build {sourceCSS} -c {configJS} -o {outputCSS} # npx is not assumed by this project, to avoid worrying about it as a dependency See Configuration section for more details and implications for existing Angular projects
Add or adjust these scripts in your package.json: scripts: { "prestart": "ngtw build", "start": "ng serve & ngtw watch", "build": "ngtw build && ng build" } or simply run ngtw scripts to have these adjustments made automatically in your package.json. Now using npm start for your development server will ensure your tailwind files are being watched and built with your project, and you can still rely on the angular-cli for everything else (no ng eject! yay!).
When you're ready to filter out your unused CSS, reference the documentation below for the various ways you can implement and adjust PurgeCSS. (Quick Tip: To include PurgeCSS in your build script, simply adjust the ngtw build command like so: ngtw build --purge.)
Keep calm and angular on.