最近在搞一个 Sass 文件的编译插件,主要使用 node-sass 来进行编译,在这过程中遇到一个蛮坑的小问题。

在不压缩的情况下使用 node-sass 进行编译的样式文件没有什么问题,可以正确的编译出该有的样式。可是当进行压缩时,就出了问题了。压缩后的文件莫名奇妙的在文件最开头多了几个奇怪的字符:。

在网页上使用 BOM 是个错误。由于在文件开头多出了一个 BOM,使得压缩后的所有样式都失效了。一开始我尝试在文件最开头加上 @charset "utf-8",但是并没有什么用。不过发现了在加上 @charset "utf-8" 后,变成了这样:

最后得到解决方案,在编译后的样式中进行替换,移除 \ufeff:

虽然解决方案蛮简单的,但是在搜索答案与编码测试的过程中学到了蛮多。编码问题还是要注意的,虽然无法避免遇到 utf-8 with BOM,但是也应该尽量只保存为 utf-8 without BOM 编码格式。如果遇到奇怪的字符,那八成就是编码问题了。