将属性传递给较少的功能

Question

我正在尝试编写一个处理不同屏幕尺寸的mixin。我想让它尽可能通用，以尝试遵循DRY原则。

到目前为止，我已经尝试过：

.vary_width(@prop, @val1, @val2, @val3) {
    @media(max-width: 1023px) {
        @{prop}: @val1;
    }
    @media(min-width: 1024px) {
        @{prop}: @val2;
    }
    @media(min-width: 1080px) {
        @{prop}: @val3;
    }
}

这无法编译。我也尝试了一个建议（虽然我认为它的目标是更少的版本＆gt; 1.4）使用Ignore: ~"a;@{prop}:@{value}";命令，这也不起作用，在CSS中编译为Ignore: a;margin: 5px;。 / p>

非常感谢。

编辑： 运行lessc master.less master.css时收到错误：

ParseError: Unrecognised input in /path/to/file/mixins.less on line 46, column 16:
45     @media(max-width: 1023px) {
46         @{prop}: @val1;
47     }

Answer 1

我使用的是错误版本的lessc。归功于@ seven-phases-max作为指导。