FullHuman/purgecss-webpack-plugin

Not working with Bootstrap table (<b-table />)

alx-web opened this issue · 3 comments

Hello,

I got a problem with your plugin and Bootstrap table vuejs, the css is removed.

My conf

new PurgecssPlugin({
paths: glob.sync([
'./dist/index.html',
'./src/components/.vue',
'./src/views/
.vue',
'./src/.vue',
'./src/!**/!
.vue'
])
}),

My vue file

[...]
<b-table striped hover
:items="items"
:fields="fields"
:striped="false"
:outlined="true"
:tbody-class="'bg-table'">
</b-table>
[...]

When i build for production the css of the generated table is removed. I think it's because <table is not really in the code but generated by the component.

Do you have an idea to resolve this?

Thanks,

Alex

Thanks for reporting this issue.
I don't have a specific idea on how to resolve this issue in the most effective way right now.
But I would whitelist the css classes that are being remove as a solution: docs

Yes i will play with whitelist but it's time consuming to check every class.

I think you should install boostrap vue js and do a <b-table> like my example and you will get a better idea how to resolve the problem. Bootstrap is a popular library and i think other people have the same problem as me.

Thanks !

Alex

You could also add the bootstrap vue components from inside node_modules to the paths.
Ill close this issue for now, but let us know if you are still having a problem with this