@charset "UTF-8"单独加在SCSS开头无效,因Ruby默认用GBK解码UTF-8文件,读取阶段即报错;必须同步修改engine.rb中Encoding.default_external = Encoding.find('utf-8'),并确保文件为UTF-8无BOM、@charset为首行首字符、项目路径不含中文。

@charset "UTF-8" 放在 SCSS 文件开头,根本不能修复编译报错或生成乱码——它只对最终输出的 CSS 文件生效,而 Ruby 读取源文件时早已崩在解码阶段。
为什么 @charset "UTF-8" 单独加了还是报 Invalid GBK character "\xE5"
错误里那个 "\xE5" 是 UTF-8 编码的汉字首字节(比如“中”),Ruby 却用 GBK 去解,直接抛出异常。此时 Sass 解析器压根没启动,@charset 还躺在文件里,根本没被读到。
-
@charset只影响 Sass 解析器对已读入内容的解释方式,不干预 Ruby 打开文件的底层解码行为 - 它必须是文件第一行、第一个字符——前面不能有 BOM、空格、注释或空行
- 小写
utf-8在旧版 Sass 中会被忽略,必须写成UTF-8 - 记事本保存的“UTF-8”默认带 BOM,VS Code/Sublime 要选 “UTF-8 without BOM”
必须改 engine.rb 中的 Encoding.default_external
Ruby(尤其 Windows 下)默认 Encoding.default_external 是 GBK,不是 UTF-8。要让它用 UTF-8 打开文件,得手动改 Sass gem 的 engine.rb。
- 先运行
sass -v确认版本,再用gem which sass或bundle show sass查真实路径(别只看系统 Ruby 安装目录) - 典型路径:
C:\Ruby25-x64\lib\ruby\gems\2.5.0\gems\sass-3.7.3\lib\sass\engine.rb(Windows)或/usr/local/lib/ruby/gems/3.0.0/gems/sass-3.7.4/lib/sass/engine.rb(macOS) - Koala / CodeKit 用户:进其安装目录找内嵌 gem,比如
D:\Koala\rubygems\gems\sass-3.4.9\lib\sass\engine.rb - 在所有
require语句之后、module Sass或class Sass::Engine定义之前插入一行:Encoding.default_external = Encoding.find('utf-8')
sass --watch 报 incompatible character encodings: GBK and UTF-8 怎么办
这是 watch 模块(如 rb-inotify 或 listen)在 Windows 下对中文路径支持极差导致的,即使 engine.rb 已修复,watch 仍可能失败。
立即学习“前端免费学习笔记(深入)”;
- 临时验证方法:把项目移到纯英文路径,例如
C:\projects\my-app - 避免使用含中文的路径,如
D:\我的项目\src\style.scss或C:\Users\张三\project - 注意:手动编译可能成功,但
--watch会额外触发监听模块,编码兼容性更弱
最容易被跳过的点:改完 engine.rb 后没确认是否改对了 gem 版本路径,或者编辑器悄悄存成了带 BOM 的 UTF-8 —— 这两种情况都会让整个修复链断裂。


















