component.scss inside component folder does not work
If you try to style inside child components it will not work. You should use ng-deep in scss. More information about styling.
::ng-deep .className {}
For me, I needed to set ViewEncapsulation.None
for my styleURLs
to take effect:
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
@Component({
selector: 'app-testing',
templateUrl: './testing.component.html',
styleUrls: ['./testing.component.scss'],
encapsulation: ViewEncapsulation.None,
})
export class TestingComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
I am not sure why this is necessary. It is needed in Angular 8 at least, but not in Angular 9 thankfully.
In the component, watch out what is given as the StyleUrl:
@Component({
selector: 'app-something',
templateUrl: './something.component.html',
styleUrls: ['./something.component.scss']
})
Maybe your syntax is bad, or you are referring to a simple something.component.**css**
instead of .scss
file.