Stylus 中的动态属性构建函数给出了预期的“：”，得到了“[”

Question

我有以下手写笔代码

spaces = {
  none: 0,
  xxx-small: .125,
  xx-small: 25,
  x-small: .5,
  small: .75
  medium: 1,
  large: 1.5,
  x-large: 2,
  xx-large: 3
}
properties = top, right, bottom, left
types = {
  m: margin,
  p: padding
}
space()
  for type in types
    for property in properties
      for space in spaces
        .{type}-{property}--{space}
          {types[type]}-{property}: {spaces[space]}rem

space()

我希望它输出如下内容：

.m-top--none {
  margin-top: 0rem;
}
.m-top--xxx-small {
  margin-top: 0.125rem;
}

etc

但是我遇到了错误：

expected ":", got "["

知道我在这里做错了什么吗？如果我拿 {spaces[space]}rem 换成 1000% 作为例子，好像行得通？

Answer 1

手写笔目前不支持属性值内的插值。在这种情况下您需要使用 ()：

{types[type]}-{property}: (spaces[space])rem

Stylus 中的动态属性构建函数给出了预期的“：”，得到了“[”

Dynamic Property Build Function in Stylus gives a expected ":", got "["

css

stylus

Stylus 中的动态 属性 构建函数给出了预期的“：”，得到了“[”

Dynamic Property Build Function in Stylus gives a expected ":", got "["

css

stylus

Stylus 中的动态属性构建函数给出了预期的“：”，得到了“[”