purgecss-webpack-plugin 1.6 -> 2.1.2 ignores styles in vue SFCs

[tarponjargon]

I upgraded the webpack purgecss-webpack-plugin from 1.6 to 2.1.2 and now the styles in my vue single file components are getting stripped in my production build (seeming to indicate purgecss isn't finding the vue files).

I reverted back to 1.6 and everything worked fine again. What am I missing?

The relevant parts of my webpack.config.js:

// css loaders
{
    test: /\.s?[ac]ss$/,
    use: [
        "vue-style-loader",
                 {
            loader: MiniCssExtractPlugin.loader
        },
        {
            loader: "css-loader"
        },
        {
            loader: "postcss-loader",
            options: {
                ident: "postcss",
                sourceMap: ifNotProduction(),
                plugins: () =>
                    ifProduction([
                        require("autoprefixer")({
                            preset: "default"
                        }),
                        require("cssnano"),
                        require("css-mqpacker")
                    ])
            }
        },
        {
            loader: "sass-loader",
            options: {
                implementation: require("node-sass"), 
                                 sourceMap: ifNotProduction()
            }
        }
    ]
},

optimization: {
    minimize: true
}

// plugins
new PurgecssPlugin({
    paths: glob.sync(["./src/**/*.{js,html,vue}"])
})

I attempted using the paths that are in the docs, with same result:

    new PurgecssPlugin({
      paths: glob.sync(`${PATHS.src}/**/*`,  { nodir: true }),
    }),

[Ffloriel]

PurgeCSS 2.0+ will remove classes with unused attributes. They are used to scope vue SFCs in build time.

Adding the line below to the configuration should fix this issue.

whitelistPatterns: [ /data-v-.*/ ],

[tarponjargon]

Perfect - thanks much!