Why does Sass prepend an incorrect @charset rule?

character-encoding, css, phpstorm, sass

Solution

Try adding `@charset "UTF-8";` to your original SCSS file, SASS shouldn't override it/add its own then.

Problem

I use ``` sass --watch scss:css ``` to have Sass automatically create CSS files (and put them in the `/css` directory) for each SCSS file (from my `/scss` directory). In my SCSS file I have this: ``` .foo::before { content: "▶"; } ``` When I test the web page in the browser, that "play" character is not displayed - instead I see a bunch of weird letters with carons and other accents. I inspected the generated CSS file and noticed this in the first line: ``` @charset "CP852"; ``` I then manually changed that to this: ``` @charset "UTF-8"; ``` which resulted in my "play" button being rendered correctly. Now, why does Sass set the charset to `"CP852"`? I'm writing the SCSS file in PhpStorm which reports that the SCSS file indeed is UTF-8 encoded (I see that in the status bar of PhpStorm).

Original source