Почему Sass добавляет неправильное правило @charset?

Я использую

sass --watch scss:css

чтобы Sass автоматически создавал файлы CSS (и помещал их в каталог /css) для каждого файла SCSS (из моего каталога /scss).

В моем SCSS файле у меня есть следующее:

.foo::before {
    content: "▶";
}

Когда я тестирую веб-страницу в браузере, этот символ "играть" не отображается - вместо этого я вижу кучу странных букв с каронами и другими акцентами.

Я проверил созданный файл CSS и заметил это в первой строке:

@charset "CP852";

Затем я вручную изменил это на следующее:

@charset "UTF-8";

в результате чего моя кнопка воспроизведения воспроизводится правильно.

Теперь, почему Sass установил кодировку на "CP852"? Я пишу файл SCSS в PhpStorm, который сообщает, что файл SCSS действительно кодируется в кодировке UTF-8 (я вижу это в строке состояния PhpStorm).

Ответ 1

Попробуйте добавить @charset "UTF-8"; в исходный файл SCSS, SASS не должен переопределять его/добавлять его потом.

Ответ 2

Подобно @Alireza-Fatahi заявляет в этот ответ, вы можете сохранить строку в выводе CSS и вместо этого пойти по умолчанию для Charset для внешних файлов, добавив эту строку в config.rb в папке проекта:

Encoding.default_external = "UTF-8"