David Strauch
David Strauch

Reputation: 199

How to convert number value to string in SCSS

I have a variable in SCSS. This variable could be a number 500 or a string italic, based on users input.

With Webpack I got an Error

@if str-index($style, "italic") { ^ Argument $string of str-index($string, $substring) must be a string

How can I convert the number into a string in SCSS/SASS?

Upvotes: 3

Views: 3937

Answers (1)

roNn23
roNn23

Reputation: 1662

Got the same question and found a solution. You have to wrap the number in #{} to use the interpolation.

Here is a demo function:

@function transform-number-to-string($value) {
  @if type-of($value)=='number' {
    @return #{$value};
  }
  @else if type-of($value)=='string' {
    @return $value;
  }
  @else {
    @error 'Input #{$value} is no number or string';
  }
}

More info: https://sass-lang.com/documentation/interpolation

Upvotes: 5

Related Questions