Skipping Specific Component Styles

Question

I try to do something realy basic what is described in spartacus documentation https://sap.github.io/spartacus-docs/css-architecture/#skipping-specific-component-styles

At file src/styles.scss:

$styleVersion: 4.3;
$skipComponentStyles: (cx-mini-cart, cx-product-carousel, cx-searchbox);
@import '~@spartacus/styles/index';

But looks like $skipComponentStyles variable not works as expected, no changes at UI. Is this a bug of lattest release or do I miss something?

Answer 1

It was not working for me too before I changed the styles imports from angular.json to styles.scss.

Before:

"styles": [
              "src/styles.scss",
              "src/styles/spartacus/user.scss",
              "src/styles/spartacus/storefinder.scss",
              "src/styles/spartacus/product.scss",
              "src/styles/spartacus/order.scss",
              "src/styles/spartacus/checkout.scss",
              "src/styles/spartacus/cart.scss"
            ],

After:

"styles": [
              "src/styles.scss"
            ],

styles.scss

$skipComponentStyles: (cx-mini-cart);
@import '~@spartacus/styles/index';

@import "styles/spartacus/user";
@import "styles/spartacus/storefinder";
@import "styles/spartacus/product";
@import "styles/spartacus/order";
@import "styles/spartacus/checkout";
@import "styles/spartacus/cart";

@import 'styles/custom-styles';