CODEWITHSUNDEEP
cssangularsassextend
Shyam3089
Shyam3089

Reputation: 499

How to extend a class from an imported SCSS?

shared.scss:

.gridContainer {
    display: grid;
    background-color: #efefef;
}

my-component.scss

@import url("../../../shared.scss");
.contentWrapper {
   @extend .gridContainer
}

When extending to .gridContainer from angular component scss(my-component.scss) I'm getting this error. The import is fine here. Is it possible to extend like this? If not how to access the class or variable from the shared.scss?

ERROR in Module build failed (from ./node_modules/sass-loader/dist/cjs.js): SassError: The target selector was not found. Use @extend .gridContainer !optional to avoid this error.`

Upvotes: 4

Views: 2165

Answers (1)

Drenai
Drenai

Reputation: 12397

I don't think the import statement is correct. Try @import 'shared.scss'

Similar issue to https://stackoverflow.com/a/51480665/271012

Upvotes: 1

Related Questions