bootstrap 4 - SCSS: missing boostrap file when import

Question

I'm trying to import a file that calls boostrap from here:

cart_custom.scss file:

@import "../../../../../../../storefront-reference-architecture/cartridges/app_storefront_base/cartridge/client/default/scss/cart"

long uh?

and this is the file I want to import:

cart.scss file:

@import "variables";
@import "bootstrap/scss/variables";
@import "bootstrap/scss/mixins/breakpoints";
@import "utilities/deleteCardButton";
@import "components/quickView";

$spacer: 0.625em;
$negative-spacer: -0.625rem;

.single-approaching-discount {
    border: 1px solid rgba(0, 0, 0, 0.125);
    background-color: $white;
    color: $success;
    margin-bottom: 0.3125rem;
}

...

When I try to compile I receive the next error:

Message:
    ..storefront-reference-architecturecartridgesapp_storefront_basecartridgeclientdefaultscss\_variables.scss
Error: File to import not found or unreadable: bootstrap/scss/functions.
        on line 1 of ../storefront-reference-architecture/cartridges/app_storefront_base/cartridge/client/default/scss/_variables.scss
        from line 1 of ../storefront-reference-architecture/cartridges/app_storefront_base/cartridge/client/default/scss/cart.scss
        from line 1 of cartridges/app_skberge_peru/cartridge/client/default/scss/cart.scss
>> @import "bootstrap/scss/functions";
   ^

I thought that when you imported a file you got all the imports that that file had!

What am I doing wrong?

EDIT: the cart.scss file works by his own but when you import it from another file you get the error above.

question from:https://stackoverflow.com/questions/65889412/scss-missing-boostrap-file-when-import

Answer 1

Waitting for answers