删除SASS中的扩展选择器

如何删除特定选择器

所需的SAS

.a {
    .b {
        .c {
            .d {
                .g {
                    ...
                }
            }
        }

        .c > {
            .e {
                .h {
                    ...
                }
            }
            .f {
                ...
            }
        }
    }
}

.a {
    .b {
        .c > {
            .d { // remove > for .d
                .g {
                    ...
                }
            }
            .e {
                .h {
                    ...
                }
            }
            .f {
                ...
            }
        }
    }
}

已生成

.a .b .c .d .g { ... }
.a .b .c > .e .h { ... }
.a .b .c > .f { ... }

.a .b .c > .d .g { ... } // extra  > 
.a .b .c > .e .h { ... }
.a .b .c > .f { ... }

组合SAS

.a {
    .b {
        .c {
            .d {
                .g {
                    ...
                }
            }
        }

        .c > {
            .e {
                .h {
                    ...
                }
            }
            .f {
                ...
            }
        }
    }
}

.a {
    .b {
        .c > {
            .d { // remove > for .d
                .g {
                    ...
                }
            }
            .e {
                .h {
                    ...
                }
            }
            .f {
                ...
            }
        }
    }
}

已生成

.a .b .c .d .g { ... }
.a .b .c > .e .h { ... }
.a .b .c > .f { ... }

.a .b .c > .d .g { ... } // extra  > 
.a .b .c > .e .h { ... }
.a .b .c > .f { ... }

---

如何删除

>
.d
的选择器及其在上述SASS中的同级，以使其高效，而不是多次重新写入同一选择器？
如果我理解正确，可以使用以下方法实现此目的：

这将产生：

.a .b .c .d .g {
  color: red;
}
.a .b .c > .e .h {
  color: red;
}
.a .b .c > .f {
  color: red;
}

在Sass中操纵选择器并不优雅

.a {
    .b {
        .c > {
            @at-root #{set-nth(nth(&, 1), length(nth(&, 1)), '')} {
              .d {
                  .g {
                      color: red;
                  }
              }
            }
            .e {
                .h {
                    color: blue;
                }
            }
            .f {
                color: green;
            }
        }
    }
}

输出：

.a .b .c .d .g {
  color: red;
}
.a .b .c > .e .h {
  color: blue;
}
.a .b .c > .f {
  color: green;
}

首先，正确地筑巢是非常干净的：

.a {
    .b {
        .c {
            .d {
                .g {
                    color: red;
                }
            }
            > .e {
                .h {
                    color: blue;
                }
            }
            > .f {
                color: green;
            }
        }
    }
}

顺便说一句，你的CSS规则是非常具体的，这可能会导致问题进一步恶化。任何超过2或3个级别的特异性，可能有更好的方法来做到这一点。@rwacarter是的，但这是必需的。是的，有没有其他方法来删除根目录下
@之后重复的
.a.b.c
。？在根目录下使用“@at”（不带：…..”，这似乎比现有的要复杂得多，&嵌套
.c
多次使用，我想避免这种情况。