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")()
  ]
};