Unicode character codes in SCSS converted in 9.0.0-next.3

[jponeill]

🐞 Bug report

Command (mark with an x)

- [ ] new
- [x] build
- [ ] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Is this a regression?

Yes.

Yes, the previous version in which this bug was not present was: ....

Description

Running ng build --configuration production with the following in styles.scss ...

a.current-open:after {
content: "\f107";
font-family: "FontAwesome";
font-weight: bold;
}

... turns into
@charset "UTF-8";a.current-open:after{content:"";font-family:FontAwesome;font-weight:700}

...which doesn't render correctly in the browser (Safari, Chrome & IE)

A clear and concise description of the problem...

🔬 Minimal Reproduction

1. ng new w/ no routing and SCSS
2. Change angular-cli to @9.0.0-next.3
3. Change angular version to @9.0.0-next.7
4. rm -rf node_modules
5. rm package.json
6. npm install
7. Add this to styles.scss

a.current-open:after {
content: "\f107";
font-family: "FontAwesome";
font-weight: bold;
}

8. build using ng-build --configuration production

... resulting .css is changed from content: "\f107"; to content:"";

🔥 Exception or Error

🌍 Your Environment

Angular CLI: 9.0.0-next.5
Node: 12.3.1
OS: darwin x64
Angular: 9.0.0-next.7
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-next.5
@angular-devkit/build-angular     0.900.0-next.5
@angular-devkit/build-optimizer   0.900.0-next.5
@angular-devkit/build-webpack     0.900.0-next.5
@angular-devkit/core              9.0.0-next.5
@angular-devkit/schematics        9.0.0-next.5
@angular/cdk                      8.2.0
@angular/cli                      9.0.0-next.5
@angular/material                 8.2.0
@ngtools/webpack                  9.0.0-next.5
@nguniversal/express-engine       8.1.1
@schematics/angular               9.0.0-next.5
@schematics/update                0.900.0-next.5
rxjs                              6.5.3
typescript                        3.5.3
webpack                           4.40.2

Anything else relevant?

[alan-agius4]

Hi, this is because Dart Sass only supports UTF-8 related to sass/dart-sass#568

As a workaround you can opt-in to use node-sass which supports ASCII characters, by installing it in your workspace

npm i node-sass --save-dev

I am going to close this since it's not actionable by use.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}