Does purgecss work for Next.js?

[Elindo586]

So I want to reduce unused css as Google Lighthouse is giving me this error

^^ From there I go to this page:
https://purgecss.com/guides/next.html

which pretty much tells me:

-npm a few items
npm install postcss-flexbugs-fixes postcss-preset-env.
also I did npm npm i -D @fullhuman/postcss-purgecss

• make a folder in at root: postcss.config.js
• and paste this code:

module.exports = {
  "plugins": [
    "postcss-flexbugs-fixes",
    [
      "postcss-preset-env",
      {
        "autoprefixer": {
          "flexbox": "no-2009"
        },
        "stage": 3,
        "features": {
          "custom-properties": false
        }
      }
    ],
    [
      '@fullhuman/postcss-purgecss',
      {
        content: [
            './pages/**/*.{js,jsx,ts,tsx}',
            './components/**/*.{js,jsx,ts,tsx}',
            "./next/static/css/c0614d34a0ab3efc.css " ,
        ],

///  ^^ added this last file to the array..
        defaultExtractor: content => content.match(/[\w-/:]+(?<!:)/g) || [],
        safelist: ["html", "body"]
      }
    ],
  ]
}

^^^ This does nothing other than not showing a good CSS during my npm run dev....

If I run npm build and npm start, then check for errors, the error still remains.

What am I doing wrong?

[Elindo586]

So I think I made this "work"... however... I am using react-bootstrap and apparently there is no a good way to purge the unuse Css without taking out the Css that I am actually using..

Solution? Better not use react-bootstrap if you don't want to end up with tons of unused CSS.