Meno CSS "alias" con bootstrap + font-impressionante

Question

mio sito utilizza bootstrap + font-awesome e sto cercando di creare un "alias" nella mia site.less di file:

.icon-domain { .icon-fire; } 
.icon-group { .icon-tags; } 

La ragione per cui sto facendo questo è perché ho un'entità "Dominio" sul mio sito e potrei cambiare l'icona in futuro, quindi non voglio usare direttamente l'icona "fuoco" nel mio HTML.

La classe icon-group funziona sul mio codice ma non su icon-domain. Da quello che posso dire, è perché font-awesome ha effettivamente una classe icon-group nel suo codice. Da quello che ho capito di lesscss posso includere una classe all'interno di un'altra classe per combinarli in una nuova classe, ma semplicemente non funziona qui.

posso farlo funzionare se faccio questo nel mio site.less:

.icon-domain { &:before { content: "\f06d"; } } 

Ma questo non è l'ideale dal momento che ho per definire il contenuto me stesso e con .icon-domain { .icon-fire; &:before; } è un errore di sintassi. Esiste comunque un modo per farlo funzionare correttamente?

Answer 1

è necessario includere le adeguate dipendenze bootstrap:

@import "bootstrap/variables.less"; 
@import "bootstrap/mixins.less"; 
@import "bootstrap/sprites.less"; 

.icon-domain { .icon-fire; } 
.icon-group { .icon-tags; } 

Answer 2

è necessario importare Font CSS impressionante nel file MENO e let LESS process it.

Senza di esso MENO non sarà in grado di rilevare le classi che si sta tentando di utilizzare.