Tailwind CSS: Purge unused CSS

Image for post
Image for post

For removing unused CSS from TailwindCSS you don’t need another tool or NPM, It has a built-in config that will purge the unused CSS. To use this you need to have a tailwind.config.js file in your project’s directory, inside it, export an object like shown below, using JavaScript syntax, and define a property namedpurge with type as an array. Which will find the files that are using Tailwind. In my case, I'm using typescript to react.

module.exports = {
purge: [
"./src/**/*.{ts,tsx}"
]
}

In my given example I searched for any .ts or .tsx files inside the src folder to any nested level. So it’s working!

Now if you don’t need to purge any CSS then simply make it false

module.exports = {
purge: false
}

This is helpful if you’re not planning to use any extra plugin to purge.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store