javascript

Setup Tailwind CSS with Angular 11

Install tailwind css with npm

Run the following command to install tailwind css

npm install -D tailwindcss

Generate Tailwind configuration file

In the root of the project generate the tailwind css configuration file by using this command

 npx tailwindcss init

For optional performance , enable all the things in the tailwind configuration file

Just In Time Mode

Enable this, for optimizing build and ensure better performances result

Purge Unused CSS styles

To ensure Tailwind removes all unused CSS classes, enable purge and provide the path to all files that consume the Tailwind-CSS classes in your tailwind.config.js file. This will result in a smaller sized style bundle.

Add Tailwind to your style.css file to enable globally

To confirm that Tailwind is working correctly, simply add a button to your html file in any of your components.

After this check the result. Tailwind is setup correctly.

Cool Dev

View Comments

Share
Published by
Cool Dev

Recent Posts

Bash Script Basics Tutorial: #1

Bash Script Basics Bash scripting is a powerful way to automate tasks in Linux. This…

1 year ago

Screen vs Tmux: Which One to Choose?

Screen vs Tmux Both screen and tmux are popular terminal multiplexers that allow you to…

1 year ago

How to Use nohup

How to Use nohup The nohup command allows you to run a script or command…

1 year ago

Running Bash script in background

Running Bash script in background Running Bash script in the background is useful for executing…

1 year ago

How do I make Git ignore file mode (chmod)?

How do I make Git ignore file mode (chmod)? Git is a powerful version control…

1 year ago

How to setup laravel project using homestead

Step 1 : Create a new directory Homestead by using this command  cd ~/Homestead Step…

3 years ago

This website uses cookies.