CODEWITHSUNDEEP
csscharacter-encodingsassphpstorm
Šime Vidas
Šime Vidas

Reputation: 186103

Why does Sass prepend an incorrect @charset rule?

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).

Upvotes: 15

Views: 15438

Answers (2)

Blair McMillan
Blair McMillan

Reputation: 5349

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

Upvotes: 32

Volker E.
Volker E.

Reputation: 6044

Like @Alireza-Fatahi states in this answer, you could save a line in CSS output and instead go for a default Charset on external files, by adding this line to your config.rb in your project folder:

Encoding.default_external = "UTF-8"

Upvotes: 5

Related Questions