手写笔 - 使用属性查找从扩展选择器引用属性

Question

我想找到一种从扩展选择器引用属性的方法。不幸的是，property lookup似乎并不适用于此：

.foo
  font-size 12px
.bar
  @extends .foo
  line-height @font-size * 2

/* Output */
.foo,
.bar {
  font-size: 12px;
}
.bar {
  line-height: ;
}

这似乎应该是可能的。这是一个没有@extends的简单示例：

.foo
  font-size 12px
  line-height @font-size * 2

/* Output */
.foo {
  font-size: 12px;
  line-height: 24px;
}

随意为自己尝试：https://learnboost.github.io/stylus/try.html

Answer 1

你忽略了范围！请参阅下面的注释代码：

.foo
  font-size 12px
.bar
  font-size 12px  //<< as long as there is no font-size in .bar scope, you cant reference to it. For that cases use variables.
  @extends .foo
  line-height @font-size * 2 

/* Output */
.foo,
.bar {
  font-size: 12px;
}
.bar {
  line-height: 24px;
}

带变量

f-size = 12px
.foo
  font-size f-size
.bar
  font-size f-size  
  @extends .foo
  line-height @font-size * 2
  //or
  line-height @f-size * 2
  //or
  line-height f-size * 2


 /* Output */
    .foo,
    .bar {
      font-size: 12px;
    }
    .bar {
      line-height: 24px;

    }