LESS编译器说参数未定义

在我的代码中，我使用LESS模式匹配mixins。当我尝试将一个参数传递给我的mixin时，我得到一个错误。LESS编译器说参数未定义

这是我的代码：

.slide(parallax; @bg, @padding) { 
    background: url(@bg) 50% 0 fixed; 
    height: auto; 
    margin: 0 auto; 
    width: 100%; 
    position: relative; 
} 

.slide(np; @bg, @padding) { 
    background-color: @bg; 
} 

.slide(@_; @bg, @padding) { 
    padding: @padding 0; 
} 

@slide: parallax; 
#ghp { 
    .slide(@slide; "../images/ghp.png", 12%); 
}

在编译时，它抛出这个错误：

variable @bg is undefined

为什么被抛出这个错误，我该如何解决？

来源

2014-12-27 Leo Alfred

您是否了解过LESS模式匹配mixins？如果您知道模式匹配mixin，则可以回答您的两个问题。 – 2014-12-27 16:35:31

Quoting Less Website

If the compiler sees at least one semicolon inside mixin call or declaration, it assumes that arguments are separated by semicolons and all commas belong to CSS lists.

以上意味着当您以下面的格式调用mixin时，mixin调用只有2个值（或参数）。第一个参数的值为@slide变量，第二个参数的整个剩余部分（即"../images/ghp.png", 12%）。

.slide(@slide; "../images/ghp.png", 12%);

这就是为什么你得到错误说其中一个变量未定义的原因。这可以通过使用相同的分隔符（分号或昏迷，偏好是分号）来克服。

因此，例如下面的代码会非常好地编译。

.slide(parallax; @bg; @padding) { 
    background: url(@bg) 50% 0 fixed; 
    height: auto; 
    margin: 0 auto; 
    width: 100%; 
    position: relative; 
} 

.slide(np; @bg; @padding) { 
    background-color: @bg; 
} 

.slide(@_; @bg; @padding) { 
    padding: @padding 0; 
} 

@slide: parallax; 
#ghp { 
    .slide(@slide; "../images/ghp.png"; 12%); 
}

来源

2014-12-27 16:50:00 Harry

LESS编译器说参数未定义

回答

相关问题