在css中调试奇怪的少输出

Question

我使用gulp和gulp-less预处理我的.less文件，随着时间的推移，我想出了一些相当复杂的结构，同时让我有一些真正的灵活性使调试变得困难。

目前，我在main.css文件的开头有以下输出：

@media screen and (max-width: 767px) {
}
@media (min-width: 768px) {
}
@media (min-width: 768px) {
}
@media (max-width: 767px) {
}
@media (min-width: 768px) {
}
@media (min-width: 768px) {
}
@media (max-width: 767px) {
}
@media (max-width: 767px) {
}

由于我的所有媒体查询都是使用变量定义并使用mixin调用的，因此看起来它应该很容易调试....但是，我的任何文件中都没有任何内容可以生成这个 - 在至少据我所知 - 实际上甚至没有那么多候选人可以解析这可能会产生这种情况 - 所以我有点卡住了。

但实际上，更大的问题 - 无论是什么原因造成的 - 是，如何调试可能复杂的less输出。除了在各处发表评论之外，我所知道的并没有明显的伎俩。

任何帮助？