Toast css is wiped when using purgecss

[Djiit]

Overview of the problem

Buefy version: 0.7.0
Vuejs version: 2.5.17
OS/Browser: MacOS Mojave / Electron 3.0;

Description

Hi there ! Not sure if it is a bug related to Buefy directly but I didn't encounter it with other libraries.
Please tell me if I can provide you with more info or test case.

Steps to reproduce

Add Buefy to your project.
Add PurgeCSS.
Toasts are no more styled (might the the case of other non-bulma components.

Here is my postcss.config.js:

const tailwindcss = require("tailwindcss");
const purgecss = require("@fullhuman/postcss-purgecss");
const autoprefixer = require("autoprefixer");

class TailwindExtractor {
  static extract(content) {
    return content.match(/[A-z0-9-:\/]+/g) || [];
  }
}

module.exports = {
  plugins: [
    tailwindcss("./src/assets/js/tailwind.js"),
    purgecss({
      content: [
        "./src/**/*.vue",
        "./src/**/*.js",
        "./src/**/*.html",
        "./public/index.html"
      ],
      fontFace: true,
      extractors: [
        {
          extractor: TailwindExtractor,
          extensions: ["html", "js", "vue"]
        }
      ]
    }),
    autoprefixer
  ]
};

Expected behavior

Toasts are still styled like the rest of buefy elements.

Actual behavior

Toasts are displayed without any CSS a the end of the page.

Note: If your wrap the Buefy import between /* purgecss start ignore */ and /* purgecss end ignore */; that's my workaround for now.

[netname]

I am having the same problem. Also the Select with Fontawesome shows the icon to the right and outside of the Select box
My .postcssrc.js:

const autoprefixer = require("autoprefixer");
const purgecss = require("@fullhuman/postcss-purgecss")

module.exports = {
plugins: [
   autoprefixer( {} ),
   purgecss({
          content: [
            "./src/**/*.html", 
            "./src/**/*.vue"
          ]
    })
 ]
}

[netname]

Purgecss has a guide on how to use it with Vue. https://www.purgecss.com/guides/vue

I just followed the instructions and everything worked!

Edit:
The correct link is: https://github.com/FullHuman/purgecss/tree/master/examples/with-vue/

[pera]

Note that whitelisting is required since some class names are dynamically constructed, such as navbar-start and navbar-end (by navbar-${positionName}).

@jtommy is support for PurgeCSS something that Buefy could be interested in?

[jtommy]

@pera sure, you are welcome!

[jtommy]

@pera please open a new issue in order to discuss about it ;)

[pera]

@jtommy Sorry! I just moved my post into this new ticket: #1822

[nkmnz]

hi @Djiit , where do I have to wrap the buefy import?