Skip to main content

Install TailwindCSS in Angular

Updated 1 min readMarkdown
Install TailwindCSS in Angular

Today we will see how to install TailwindCSS in an Angular project

Create or use your Angular project

ng new project
cd project

**Install and configure TailwindCSS **

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init # Will generate a file tailwind.config.js

Configure the paths of all your template files

Edit your tailwind.config.js to add these lines :

module.exports = {
  content: [
    "./src/**/*.{html,ts}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

Add TailwindCSS directives to your CSS file style.css

@tailwind base;
@tailwind components;
@tailwind utilities;

**Enjoy using TailwindCSS ** ng serve

About the author

  • Full stack engineer but passionnated by front-end Angular Expert / NX / JavaScript / Node / Redux State management / Rxjs

No comments yet. Be the first to comment.

More from this blog