postcss.config.js

const isHotReloaded = process.argv.includes('serve')

class TailwindVueExtractor {
  static extract (content) {
    const contentWithoutStyleBlocks = content.replace(/<style[^]+?<\/style>/gi, '')
    return contentWithoutStyleBlocks.match(/[A-Za-z0-9-_:/]+/g) || []
  }
}

const extensionsUsingCSS = [ 'vue', 'html' ]
const extensionsOfCSS = [ 'css', 'less', 'pcss', 'postcss', 'sass', 'scss', 'styl' ]

module.exports = {
  plugins: [
    require('postcss-preset-env')({ stage: 2 }),
    require('tailwindcss')('./tailwind.config.js'),
    !isHotReloaded && require('@fullhuman/postcss-purgecss')({
      content: [ `./@(public|src)/**/*.@(${extensionsUsingCSS.join('|')})` ],
      css: [ `./src/**/*.@(${extensionsOfCSS.join('|')})` ],
      extractors: [
        {
          extractor: TailwindVueExtractor,
          extensions: extensionsUsingCSS
        }
      ]
    }),
    require('autoprefixer')()
  ]
}