3
respostas

[Bug] Import dos styles dos arquivos CSS não funciona

Bom dia

Atualemte neste curso que estou fazendo, quando eu tento fazer os imports dos estilos com o import styles from 'Nome do arquivo.css', os estilos não estão sendo aplicados, sendo que estou fazendo o código exatamente igual ao código do instrutor.

Teria alguma configuração que tem que ser feita no vsCode para fazer os imports da maneira correta ?

Pois alguns casos eu tive que mudar os nomes das classes e fazer manualmente para poder aplicar os estilos, por causa se for fazer igual ao modo que o professor faz não está funcionando.

3 respostas

Olá, Alan! Como vai?

Pode informar como foi o caminho dos arquivos que vc utilizou e como que o instrutor aplicou por favor? Eu acabei de fazer esse curso e utilizei o mesmo caminho do instrutor sem problemas, talvez possa te ajudar na sua dúvida, porém sem um exemplo prático fica difícil.

Aguardo seu retorno! Bons estudos!

Por exemplo, eu tenho a pasta Banner contendo os arquivos index.js e Banner.css

ESTRUTURA DAS PASTAS

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Para exemplificar em poucas palavras

ESSE CASO NÃO FUNCIONA APLICAÇÃO DOS ESTILOS

import styles from './Banner.css'

className={style.Banner}

.Banner { // código omitido }

ESSE CASO, SIM FUNCIONA APLICAÇÃO DOS ESTILOS

import './Banner.css'

className="Banner"

.Banner { // código omitido }

Obrigado pelo retorno!

Certo, eu tive um problema parecido, só que no caso coloquei o nome dos arquivos assim: "Banner.modules.css", e mesmo fazendo o import com o nome correto não foi.

Creio que é porque a documentação do Create React App traz um padrão de nomemclatura para os arquivos: https://create-react-app.dev/docs/adding-a-css-modules-stylesheet/

No caso estaria faltando o ".module".

Testa inserindo o mesmo nome do arquivo e confere se agora foi por favor?