The @aofl/webcomponent-css-loader is a webpack loader that shares pruned global styles between web components.
Run npm i -D @aofl/webcomponent-css-loader
Then add the loader to your webpack config:
module: {
rules: [
{
test: /\.css$/,
use: [
{
loader: '@aofl/webcomponent-css-loader',
options: {
path: path.resolve(__dirname, '..', 'templates', 'main', 'css', 'index.css'),
cache: true,
force: false, // when true prunes current css file even if no template.js or index.js files exist
whitelist: [
'.dynamic-class'
]
}
}
]
}
]
}