encoding - 如何从CSS中删除不需要的@charset "UTF-8"(编译SASS文件后显示)

Question

我们问题的快速总结:

• 我们在编译的 CSS 文件前面添加了 @charset 声明
• 我们的 SCSS 文件没有此声明，因此会在编译期间添加
• 我的一位同事说，如果我们有这样的声明，我们的网站就会在 Safari 中崩溃

SASS 文档说:

Output Encoding

In general, Sass will try to encode the output stylesheet using the same encoding as the input stylesheet. In order for it to do this, though, the input stylesheet must have a @charset declaration; otherwise, Sass will default to encoding the output stylesheet as UTF-8. In addition, it will add a @charset declaration to the output if it’s not plain ASCII.

When other stylesheets with @charset declarations are @imported, Sass will convert them to the same encoding as the main stylesheet.

来源:http://sass-lang.com/documentation/file.SASS_REFERENCE.html

有人知道如何阻止 SASS 添加它吗？
有谁知道我们如何检查所有 SCSS 文件中的“如果不是纯 ASCII”假设？
还有其他想法吗？

Answer 1

除此之外，我最近遇到了这个问题。我们使用 gulp-sass 来编译 CSS。据我了解，如果 CSS 上有非 ascii 字符，gulp-sass(使用 node-sass)没有提供任何方法来阻止 @charset "UTF-8"; 。这对我们来说是一个问题，因为我们想为 AMP 页面使用相同的 CSS。 AMP 页面上不允许使用 @charet。请参阅本期。

https://github.com/sass/sass/issues/2288

我们的解决方案

我所做的是添加一个简单的 gulp 任务来从编译的 CSS 中删除编码属性。

gulp.task('amp-sass-clean-up', ['amp-sass' /*Add gulp-sass task that compiles CSS*/], function() {
    return gulp
        .src(['/public/amp.min.css' /*This is the full path and file name to where your final css is*/], {cwd: '/public' /*This is the full path to where final css file is*/)
        .pipe(replace('@charset "UTF-8";', ''))
        .pipe(gulp.dest('/public' /*This is the full path to where final css file is*/);
});