Two themes in Angular. Problem with variable in SCSS

Question

I try to realise two theme in Angular 10 by this flow . It works only with css. I use SCSS in my project. How can I modify this example to use scss? Sorry that I don't have any code here. Code you can find it in link. Thanks for help!

Answer 1

You need to specify you are using SCSS on your project.

You can manually change your angular.json file like so:

"schematics": {
    "@schematics/angular:component": {
        "style": "scss"
    }
},

And then change your files from CSS to SCSS, including the main styles.css referenced in the angular.json.

Answer 2

Change the app.component.css file to app.component.scss and in app.component.ts change the styleUrls to app.component.scss