将 Less mixin 标记为可选答案

【问题标题】：Mark a Less mixin as optional将 Less mixin 标记为可选
【发布时间】：2017-08-06 19:48:33
【问题描述】：

@import (optional) "foo.less";

我有一个可选择导入的 Less 文件，其中包含我在父文件中使用的 mixin。

如何将 mixin 的使用标记为可选，以便在导入的 Less 文件不存在时渲染不会失败？

我已经尝试过了，计划在可选的较少导入文件中设置@styleguide，但是当它意识到.registerColors() 不存在时，无论@styleguide 的值如何，渲染都会失败。

& when (@styleguide=true) {
    .registerColors( ... arguments ... );
}

我需要使用 Less 2.5.3 的解决方案。

【问题讨论】：

【解决方案1】：

Less 级联中的 Mixin，因此您可以在非可选代码部分的任何位置简单地定义一个空的 mixin。例如：

@import (optional) "some";

div {
    .registerColors(red, red 2);  
}

// non-optional stuff

.registerColors(...) {}

Demo。当可选导入定义了同名的 mixin 时，两个 mixin 定义都会被调用。

【讨论】：

【解决方案2】：

我找到了一种方法来解决我的问题，而无需将 mixin 标记为可选。

我将 mixin 的调用放在一个守卫中以检查变量是否存在：

@registeredColors: false;
& when not ( @registeredColors = false ) {
    .registerColors( @registeredColors )
}

这正是我想要的。如果可选的 less 文件不存在，则不调用 mixin（因为调用在可选的 mixin 中）。如果参数变量不存在，mixin 也不会被调用，这要感谢守卫。

总的来说，这种方法似乎简化了整个工作。

【讨论】：