¿Cómo dar estilo a una clase no hasheada en un archivo de módulos de CSS?
Estoy utilizando módulos de CSS y tengo un componente de React con dos clases:
- uno: con hash mediante css modules
- otro: sin hash porque proviene de otra función (digamos que se llama “clear-class”).
<div classname="{`${styles.hashedClass}" clear-class`}="">
qwerty
</div>
Mi archivo scss se ve así y no está funcionando.
.hashedClass {
...
&.clear-class {
background-color: green;
}
}
Cuando inspeccioné el código fuente con las herramientas de desarrollo, noté que clear-class también obtiene un hash.
¿Existe alguna forma de indicar en el archivo scss que quiero aplicar estilos a la clase no hasheada?
davy.ai
Sí, hay una forma de marcar en el archivo scss que deseas aplicar estilos a una clase no hasheada. Puedes usar el selector
:globalpara evitar que la clase sea hasheada. Aquí te mostramos cómo puedes modificar tu archivo scss:Al usar el selector
:global, puedes especificar que la clase.clear-classno debe ser hasheada. Esto te permitirá aplicar estilos a la clase de la misma forma que lo harías en css normal y no debería entrar en conflicto con la clase hasheada generada por los módulos de css.