Add support for scss #10

Author: athlonUA

project/application/angular.json

@@ -8,7 +8,11 @@
             "sourceRoot": "src",
             "projectType": "application",
             "prefix": "app",
-            "schematics": {},
+            "schematics": {
+                "@schematics/angular:component": {
+                    "styleext": "scss"
+                }
+            },
             "architect": {
                 "build": {
                     "builder": "@angular-devkit/build-angular:browser",
@@ -19,7 +23,7 @@
                         "polyfills": "src/polyfills.ts",
                         "tsConfig": "src/tsconfig.app.json",
                         "assets": ["src/favicon.ico", "src/assets"],
-                        "styles": ["src/styles.css"],
+                        "styles": ["src/styles.scss"],
                         "scripts": []
                     },
                     "configurations": {
@@ -66,7 +70,7 @@
                         "polyfills": "src/polyfills.ts",
                         "tsConfig": "src/tsconfig.spec.json",
                         "karmaConfig": "src/karma.conf.js",
-                        "styles": ["src/styles.css"],
+                        "styles": ["src/styles.scss"],
                         "scripts": [],
                         "assets": ["src/favicon.ico", "src/assets"]
                     }
@@ -85,7 +89,11 @@
             "sourceRoot": "src",
             "projectType": "application",
             "prefix": "app",
-            "schematics": {},
+            "schematics": {
+                "@schematics/angular:component": {
+                    "styleext": "scss"
+                }
+            },
             "architect": {
                 "build": {
                     "builder": "@angular-devkit/build-angular:server",

project/application/src/app/app.component.css renamed to project/application/src/app/app.component.scss

@@ -3,7 +3,7 @@ import { Component } from '@angular/core';
 @Component({
     selector: 'app-root',
     templateUrl: './app.component.html',
-    styleUrls: ['./app.component.css'],
+    styleUrls: ['./app.component.scss'],
 })
 export class AppComponent {
     title = 'Welcome to angular ssr app!';

project/application/src/app/app.component.ts

@@ -7,7 +7,7 @@ import { SeoPropertiesService } from '../core/services/seo-properties/seo-proper
 @Component({
     selector: 'app-home',
     templateUrl: './home.component.html',
-    styleUrls: ['./home.component.css'],
+    styleUrls: ['./home.component.scss'],
 })
 export class HomeComponent implements OnInit, OnDestroy {
     title = 'Home page!';

project/application/src/app/modules/home/home.component.css renamed to project/application/src/app/modules/home/home.component.scss

@@ -8,7 +8,7 @@ import { SeoPropertiesService } from '../core/services/seo-properties/seo-proper
 @Component({
     selector: 'app-not-found',
     templateUrl: './not-found.component.html',
-    styleUrls: ['./not-found.component.css'],
+    styleUrls: ['./not-found.component.scss'],
 })
 export class NotFoundComponent implements OnInit, OnDestroy {
     title = 'Page not found';