少混合名称被评估为颜色/颜色 [英] less mixin name is evalutated to colour/color

问题描述

我有一个较少的文件来定义一堆颜色/颜色。每个类名包含相关颜色的名称，例如 .colourOrange {..} 或 .colourBorderOrange {..} 或 navLeftButtOrange {..} 。

为了简单，我有一个mixin， ：color，并使用它来命名类，因此：

  .completeColour（@colourName，@col）{
 .colour @ {colourName} {
 ... 
} 
 .colourBorder @ {colourName} {
 ... 
} 
 .leftNavButt @ {colourName} {
  

... ..
}
}

b $ b

问题是这类的名称正在评估相关颜色。因此，不是得到 .leftNavButtOrange {} 我得到 .leftNavButt＃ffa500 {}

有一种方法来阻止这个与编译器参数或某事。基本上我不想评估，读取但不评估参数。我可以使用编译器参数，或者我需要更改名称，使它们不匹配的颜色，如myAppOrange或某事。

解决方案

这是Less的一个遗留功能。暂时，下面的解决方案之一可以用来克服这种颜色名称到十六进制代码转换。

  .completeColour（〜Orange，1）; 
  

或

  .completeColour（e（Orange），1）; 
  

这两个选项都明确告诉编译器传递的值是一个String而不是一个Color较少的编译器不会将其转换为相应的十六进制代码。

资源：

1. Less GitHub - 如何避免颜色名称转换为颜色值？


2. Less GitHub - 汇编命名的颜色导致十六进制值在插值中使用不正确

更新：

（官方更新： V2升级指南 | 原始来源： 更一致的命名颜色变量）。

I have a less file to define a bunch of colours/color. Each class name contains the name of the relevant colour, such as .colourOrange{..} or .colourBorderOrange{..} or navLeftButtOrange{..}.

To make this simple I have a mixin that uses a parameter name: colour, and uses this to name the classes thus:

.completeColour(@colourName, @col) {
.colour@{colourName}{
    …
}
.colourBorder@{colourName}{
   …
}
.leftNavButt@{colourName}{

….. } }

The problem is this the names of the classes are being evaluated to the relevant colour. So instead of getting .leftNavButtOrange{} I get .leftNavButt#ffa500{} in the resulting CSS

Is there a way to stop this with a compiler argument or something. Basically I don't want the parameter to be evaluated, read but not evaluated. Can I do this with a compiler argument or do I need to change the names so they don't match a color such as myAppOrange or something.

解决方案

This is a legacy feature of Less. For the time being, one of the below work-around solutions could be used to overcome this color name to hex code conversion.

.completeColour(~"Orange",1);

or

.completeColour(e("Orange"),1);

Both the options explicitly tell the compiler that the value being passed is a String and not a Color and hence Less compiler would not convert it to the corresponding hex code.

Sources:

1. Less GitHub - how to avoid color name be translated into color value?
2. Less GitHub - Compilation of named colors results in hex values being used incorrectly in interpolations

Update: Starting from version 2.0.0, this color name to hex code conversion would not happen if the color is mentioned explicitly as a name and has no other color based operations on it. Version 2.0.0 is currently in beta mode.

(Official Update: V2 Upgrade Guide | Original Source: More consistent named color variables).

这篇关于少混合名称被评估为颜色/颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！