Компиляция Scss / Sass преобразует строковую переменную (содержимое) в другую строку

Question

У меня в файле конфигурации есть переменная:

$temp_icon = "\75";

, позже в коде:

.signature {
    content: "$temp_icon"
}

Когда я компилирую с использованием gulp-sass / node-sass, я получаю:

  .signature {
        content: "u"
    }

это не то, что я хочу.

Answer 1

На самом деле это известная проблема .

Вы можете установить плагин gulp-sass-unicode , и он автоматически решит проблему для вас.

Что это делает?Например, у нас есть style.scss:

$testContent: "\f26e";

#test{
  content:  $testContent;
}

И задание gulp:

var sass = require('gulp-sass');

gulp.task('SimpleSASS', function(){
  gulp.src(['style.scss'])
    .pipe(sass())
    .pipe(gulp.dest( "css/" ));
});

После запуска задания gulp SimpleSASS в файле css / style.css будет следующее:

@charset "UTF-8";
#test {
  content: "";
}

Но, если мы добавим gulp-sass-unicode (см. «Использование»), файл css / style.css будет иметь следующее:

@charset "UTF-8";
#test {
  content: "\f26e";
}