Какие методы используются для объединения повторяющихся классов в SASS, которые имеют различную иерархию?

Question

Контекст

Я был нанят в проект, в котором был существующий файл SASS / SCSS. Однако у них, похоже, не было плана, как их структурировать, поэтому существует много дублирующих классов.

Проблема

Но это не просто дубликаты, которые имеют различную иерархию. Я хочу объединить их все, но только так, как я знаю, это вручную. Но мне кажется, что это можно сделать автоматически с помощью линтера или чего-то еще, но я не нахожу никаких результатов в моих поисках.

Пример

.nav {
     foo: bar;
}

Позже в документе в некотором случайном месте:

.nav {
    p {
        foo: bar;
    }
}

Другой пример

.flexslider {
    .slides {
        foo: bar;
    }
}

Тогда позже вы найдете:

.carousel {
    li {
        foo: bar;
    }
}

Когда это должно быть:

.flexslider {
    .carousel {
        .slides {
            foo: bar;
        }
        li {
            foo: bar;
        }
    }
}

Или:

.flexslider {
    .carousel {
        li.slides {
            foo: bar;
        }
    }
}