Un poco nuevo en todo el mundo html/js/css/react... Entonces, digamos que tengo un componente de reacción que genera un div que quiero diseñar, así que configuro

 <div className={"my-class-name"}> {// stuff here } </div>

Luego en un archivo .css:

 .my-class-name{ color : blue }

Aquí "mi-nombre-de-clase" es un literal de cadena, y los literales de cadena tienen una codificación incorrecta-101 en todos los idiomas que he usado, en cambio, lo que debo hacer es declarar una constante una vez:

 const MY_CLASS_NAME = "my-class-name"

y se refieren a la constante en todas partes en lugar de la literal. Por muchas razones (puede cambiarlo en un solo lugar, obtiene errores en tiempo de compilación y no en tiempo de ejecución, el IDE puede saberlo, etc.). Pero no parece que un archivo css pueda buscar una constante de javascript. ¿Hay alguna manera de hacer lo que quiero? ¿Estoy pensando en todo esto mal?

Intenté buscar en Google, no pude resolverlo, cualquier ayuda es apreciada.