Как использовать переменные из scss файла в pug?

Question

[tostershmoster]

Есть переменные в vars.scss

$DarkShade100            : rgba(31, 32, 65, 1);
$DarkShade75             : rgba(31, 32, 65, .75);
$DarkShade50             : rgba(31, 32, 65, .5);
$DarkShade25             : rgba(31, 32, 65, .25);
$DarkShade5              : rgba(31, 32, 65, .05);
$purple                  : rgba(188, 156, 255, 1);
$green                   : rgba(111, 207, 151, 1);

нужно их использовать в pug файле в миксине вместо backgrColor и opacityColor

mixin color(colorName, colorValue, backgrColor, opacityColor)
  .color-block
    .color__sample(style= 'background: '+backgrColor+'; opacity: '+opacityColor+'')
    .color__description
      h2.color__colorName= colorName
      p.color__colorCode= colorValue

.colors
  +color("Dark Shade 100%","#1F2041", "#1F2041", "1")
  +color("Dark Shade 75%" ,"#1F2041", "#1F2041", ".75")
  +color("Dark Shade 50%" ,"#1F2041", "#1F2041", ".5")
  +color("Dark Shade 25%" ,"#1F2041", "#1F2041", ".25")
  +color("Dark Shade 5%"  ,"#1F2041", "#1F2041", ".05")
  +color("Purple"         ,"#BC9CFF", "#BC9CFF")
  +color("Green"          ,"#6FCF97", "#6FCF97")

Answer 1

[bingumd]

Посмотрите тут на примере jade.

Comments

[tostershmoster]

+color("Dark Shade 100%","#1F2041", #{$DarkShade100})

9| .colors
> 10| +color("Dark Shade 100%","#1F2041", #{$DarkShade100})
-----------------------------------------------^
11| +color("Dark Shade 100%","#1F2041", "#1F2041", "1")
12| +color("Dark Shade 75%" ,"#1F2041", "#1F2041", ".75")
13| +color("Dark Shade 50%" ,"#1F2041", "#1F2041", ".5")
Syntax Error: Unexpected character '#'