Millised on & kasutamise puudused eelprotsessorites?

• Sügavast sisestusest tulenev loetavuse halvenemine.
• Koodi mõistmise ja silumise keerukus koos paljude kontekstidega selektorite sees.
• Potentsiaalsed konfliktid refaktoreerimisel, kui ei ole selge, millisele vanemselektorile ampersand kuulub.
• & võib põhjustada liigset stiilide arvu elemendi kohta, muutes CSS vähem tõhusaks.

Näide:

.parent {
  // ...
  .child {
    // ...
    &--modifier { // Kontekst .parent .child--modifier
      // ...
      &-nested { // Kontekst .parent .child--modifier-nested - muutub vähem selgeks
        color: red;
      }
    }
  }
}

Teine näide näitab, kuidas & võib varjata tegeliku selektori:

.btn {
  // ...
  &-primary { // Vastab .btn-primary-le
    background-color: blue;
  }
}

Refaktoreerimisel, kui nimetate ümber .btn, peate meeles pidama muuta ka -primary. Eraldi klassi .btn-primary kasutamine võib olla selgem ja vastupidavam muudatustele.