PurgeCSS manual configuration guidelines tailwind v2

[Peter554]

In tailwind v1 there was a section of documentation about setting up PurgeCSS manually. This seems to be missing in the v2 docs. Probably that is deliberate..?

Anyways, I have a project that uses both tailwind v2 and some older bootstrap v3 stuff (:vomiting_face:, sorry). I want to use PurgeCSS for both of these, therefore it would seem sensible to me to just configure PurgeCSS once manually in my webpack PostCSS plugin (alternate suggestions welcome). Therefore I would like to know if there are any guidelines/cautions related to setting up PostCSS manually in this way?

My current webpack PostCSS plugin looks like this, which is probably too simple (probably I need to at least override the defaultExtractor as suggested in tailwind v1 docs?)

postcss: {
  plugins: [
    require('tailwindcss')('tailwind.config.js'),
    require('autoprefixer'),
    require('@fullhuman/postcss-purgecss')({
      content: [
        `./src/**/*.+(html|pug|js|jsx|ts|tsx)`,
      ],
    }),
  ],
},

---

Update:

So my super simple config didn't work, I noticed that the responsive styles were being purged (I guess : is not working in the default defaultExtractor).

So.. I found that there is a tailwindExtractor defined in lib/purgeUnusedStyles, and am now using that directly. This seems to work much better, although 1) I'm still not sure if it works perfectly and 2) It feels a bit hacky to import from the tailwind internals like this, maybe it's not a good idea..

const {tailwindExtractor} = require('tailwindcss/lib/lib/purgeUnusedStyles');

// ...

require('@fullhuman/postcss-purgecss')({
   content: [
    `./src/**/*.+(html|pug|js|jsx|ts|tsx)`,
  ],
   defaultExtractor: content => {
      return tailwindExtractor(content);
   },
}),

[yellow1912]

I need this as well :( I'm also not sure if this is the way things should work. In my case I need to purgecss for each page I build, and I don't want to rebuild then purge everytime (taking too much time).