-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
36 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
# Specify Paths For Purging Unused CSS | ||
|
||
Tailwind CSS is a full-featured utility class CSS framework. It has just about | ||
everything you need. It also has a bunch of things you probably don't need. And | ||
there is no need to ship the CSS you don't need to the client. Tailwind is able | ||
to exclude the unused CSS through a mechanism called _purging_. | ||
|
||
To turn on purging (for _production_) and for Tailwind to know what can be | ||
safely purged, you need to specify one or more _purge paths_ in your | ||
`tailwind.config.js` file. This is a listing of all the places where you use | ||
Tailwind utility classes. | ||
|
||
Specify it with an array at the `purge` key: | ||
|
||
```javascript | ||
module.exports = { | ||
purge: ["./src/components/**/*.jsx", "./pages/**/*.js"], | ||
darkMode: false, | ||
theme: { | ||
extend: {}, | ||
}, | ||
variants: { | ||
extend: {}, | ||
}, | ||
plugins: [], | ||
}; | ||
``` | ||
|
||
Notice that globbed paths can be used as a way of specifying files located in a | ||
nested directory structure. Above I've stated that any `jsx` files located | ||
anywhere under `src/components/` as well as any `js` files located anywhere | ||
under `pages/` should be checked. | ||
|
||
[source](https://tailwindcss.com/docs/optimizing-for-production#basic-usage) | ||
|
||
[copied](https://github.com/jbranchaud/til/blob/master/tailwind/specify-paths-for-purging-unused-css.md#specify-paths-for-purging-unused-css) |