chore(sass): migrate from node-sass to sass

[Splaktar]

AngularJS Material is in LTS mode

We are no longer accepting changes that are not critical bug fixes into this project.
See Long Term Support for more detail.

PR Checklist

Please check your PR fulfills the following requirements:

• Does this PR fix a regression since 1.2.0, a security flaw, or a problem caused by a new browser version?
• The commit message follows our guidelines
• Tests for the changes have been added or this is not a bug fix / enhancement
• Docs have been added, updated, or were not required

PR Type

What kind of change does this PR introduce?

[ ] Bugfix
[ ] Enhancement
[ ] Documentation content changes
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[x] Build related changes
[x] CI related changes
[ ] Infrastructure changes
[ ] Other... Please describe:

What is the current behavior?

• We currently use "gulp-sass": "^4.1.0", which has vulnerability and only supports the deprecated node-sass package.
• This version has a lot of moderate security vulnerabilities:

                       === npm audit security report ===                        
                                                                                
# Run  npm install --save-dev [email protected]  to resolve 10 vulnerabilities
SEMVER WARNING: Recommended action is a potentially breaking change
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │  Inefficient Regular Expression Complexity in                │
│               │ chalk/ansi-regex                                             │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ ansi-regex                                                   │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > sass-graph > yargs > string-width >  │
│               │ strip-ansi > ansi-regex                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-93q8-gq69-wqmw            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │  Inefficient Regular Expression Complexity in                │
│               │ chalk/ansi-regex                                             │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ ansi-regex                                                   │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > sass-graph > yargs > cliui >         │
│               │ strip-ansi > ansi-regex                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-93q8-gq69-wqmw            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │  Inefficient Regular Expression Complexity in                │
│               │ chalk/ansi-regex                                             │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ ansi-regex                                                   │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > sass-graph > yargs > cliui >         │
│               │ wrap-ansi > strip-ansi > ansi-regex                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-93q8-gq69-wqmw            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │  Inefficient Regular Expression Complexity in                │
│               │ chalk/ansi-regex                                             │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ ansi-regex                                                   │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > strip-ansi > ansi-regex                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-93q8-gq69-wqmw            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Arbitrary File Creation/Overwrite on Windows via             │
│               │ insufficient relative path sanitization                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tar                                                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > node-gyp > tar                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-5955-9wpr-37jh            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Arbitrary File Creation/Overwrite via insufficient symlink   │
│               │ protection due to directory cache poisoning using symbolic   │
│               │ links                                                        │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tar                                                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > node-gyp > tar                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-qq89-hq3f-393p            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Arbitrary File Creation/Overwrite via insufficient symlink   │
│               │ protection due to directory cache poisoning using symbolic   │
│               │ links                                                        │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tar                                                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > node-gyp > tar                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-9r2w-394v-53qc            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Arbitrary File Creation/Overwrite due to insufficient        │
│               │ absolute path sanitization                                   │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tar                                                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > node-gyp > tar                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-3jfq-g458-7qm9            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Arbitrary File Creation/Overwrite via insufficient symlink   │
│               │ protection due to directory cache poisoning                  │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ tar                                                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > node-gyp > tar                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-r628-mhmh-qjhw            │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Regular Expression Denial of Service in trim-newlines        │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ trim-newlines                                                │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gulp-sass [dev]                                              │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gulp-sass > node-sass > meow > trim-newlines                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://github.com/advisories/GHSA-7p7h-4mm5-852v            │
└───────────────┴──────────────────────────────────────────────────────────────┘

• found 64 vulnerabilities (1 low, 43 moderate, 17 high, 3 critical)

Fixes #12114

What is the new behavior?

• found 30 vulnerabilities (1 low, 17 moderate, 9 high, 3 critical)
• The supported sass package is used.

Does this PR introduce a breaking change?

[ ] Yes
[x] No

Other information

• gulp-sass@5 requires gulp@4 but how we use it seems to work so far with gulp@3.