CODEWITHSUNDEEP
angularsass
Dachstein
Dachstein

Reputation: 4282

In Angular styles.scss @extend element with imported css library?

What I want to do in the styles.scss file is:

@import '~tachyons/css/tachyons.css';

body {
  @extend .w-100;
}

But when I call ng serve it fails with:

"body" failed to @extend ".w-100". The selector ".w-100" was not found.

But the class .w-100 exists in tachyons css library. How to do it correctly? (Note: I am using Angular 7)

Upvotes: 0

Views: 979

Answers (1)

Dachstein
Dachstein

Reputation: 4282

I found the solution.

Instead of importing the css version of tachyons, I had to import the sass version.

@import '~tachyons-sass/tachyons.scss';

body {
  @extend .w-100;
}

It seems it has something to do with the sass-loader itself? Anyways, now it works.

Upvotes: 2

Related Questions