LESS if statement для целей построения

Question

Я ищу функциональность в LESS, чтобы иметь возможность изменять одну переменную и изменять ее с помощью нескольких переменных, чтобы я мог изменить свою цель компиляции и легко изменить тонну переменных ,

Вот пример того, что я ищу. Единственная проблема заключается в том, что, поскольку я переопределяю @img внутри .compile_for_if, он находится в другом объеме.

@compile_for: "endpoint1"; 

@img_endpoint1: "./myImg.png"; 
@img_endpoint2: "https://somewhere.com/myImg.png"; 
@img: "./default.png"; 
.compile_for_if 
{ 
    & when (@compile_for = "endpoint1") 
    { 
     @img: @img_endpoint1; 
    } 
    & when (@compile_for = "endpoint2") 
    { 
     @img: @img_endpoint2; 
    } 
} 

... somewhere else ... 

.img 
{ 
    background-image:url("@{img}"); 
} 

Answer 1

Вы можете добиться этого с помощью ограждающих всех правил в безымянном пространстве имен (&{...}) и затем вызвать ваш .compile_for_if подмешать в пределах своей области. Это приведет к тому, что все переменные, установленные в пределах .compile_for_if, войдут в пространство имен, и, таким образом, все правила смогут получить к нему доступ. (. Примечание: Вы должны изменить свое .compile_for_if определение также нравится приведены ниже)

@compile_for: "endpoint1"; 

@img_endpoint1: "./myImg.png"; 
@img_endpoint2: "https://somewhere.com/myImg.png"; 
@img: "./default.png"; 

/* Added another set of conditional variables to illustrate */ 
@padding1: 10px; 
@padding2: 20px; 
@padding: 5px; 

.compile_for_if when (@compile_for = "endpoint1"){ 
    @img: @img_endpoint1; 
    @padding: @padding1; 

} 
.compile_for_if when (@compile_for = "endpoint2"){ 
    @img: @img_endpoint2; 
    @padding: @padding2; 
} 

&{ 
    .compile_for_if(); 
    .img{ 
    background-image:url("@{img}"); 
    } 

    div{ 
    padding: @padding; 
    } 
}