compile error: percent after interpolation

sass-4.2.0: bug:

$pcs: map-get($settings, "percent");
@each $pc in $pcs {
  .w-#{$pc}pc {
    width: #{$pc}%
  }
}

work well:

@each $pc in $pcs {
  .w-#{$pc}pc {
    width: #{$pc}px or any other css units
  }
}

Error: Invalid CSS after \"...width: (#{$pc}%\": expected expression (e.g. 1px, bold), was \")\"\A

[fvignals]

Thx so much, I tried lot of things but I forgot function. So, for next readers:

$settings: ( percent: (10, 20, 25, 50, 75, 80, 100) ); 
$pcs: map-get($settings, "percent");
@each $pc in $pcs {
  .w-#{$pc}pc {
    width: percentage($pc/100);
  }
}

output:

.h-10pc { height: 10%; }
.h-100pc { height: 100%; }

[nex3]

@b-d-k From the Sass documentation:

⚠️ Heads up!

It’s almost always a bad idea to use interpolation with numbers. Interpolation returns unquoted strings that can’t be used for any further math, and it avoids Sass’s built-in safeguards to ensure that units are used correctly.

Sass has powerful unit arithmetic that you can use instead. For example, instead of writing #{$width}px, write $width * 1px—or better yet, declare the $width variable in terms of px to begin with. That way if $width already has units, you’ll get a nice error message instead of compiling bogus CSS.