user3541631
user3541631

Reputation: 4008

Scss/sass compilation it converts string variable(content) to a different string

I have in configuration file a variable:

$temp_icon = "\75";

later in code:

.signature {
    content: "$temp_icon"
}

When I compile using gulp-sass/node-sass I get:

  .signature {
        content: "u"
    }

which is not what I want.

Upvotes: 0

Views: 301

Answers (1)

FortyTwo
FortyTwo

Reputation: 2639

This is actually a known issue.

You can install gulp-sass-unicode plugin and it will automatically fix the issue for you.

What does it do? For example, we have style.scss:

$testContent: "\f26e";

#test{
  content:  $testContent;
}

And gulp task:

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

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

After run gulp task SimpleSASS, in file css/style.css will be next:

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

But, if we add gulp-sass-unicode (see "Usage"), file css/style.css will have this:

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

Upvotes: 1

Related Questions