2
respostas

Importar mixins

em meu projeto tenho em várias partes do meu código o uso de mixins, inclussive na classe article e about como faço para importar os mixins? Pois ao separar o article e about do style.scss recebo um erro. Se puderem me ajudar

2 respostas

Olá Icaro. Espero poder te ajudar. Eu estava observando na aula como foi feito para poder te ajudar melhor. Pelo que eu vi, é utilizado o

 @import

para importar carregar os script .scss e depois no código que vai fazer a utilização do mixin é usado

 @include

Uma observação é que o import do arquivos só foi feito abaixo dos códigos que declaram os mixins.

Espero ter ajudado um pouco XD .

Olá Icaro, complementando o que o Raphael falou, pense na seguinte lógica:

A renderização do SCSS é de cima para baixo, ou seja, ele começa a renderizar o style.scss que é o arquivo base do css. Seguindo o código do curso, primeiro ele cria as variáveis, mixins, functions, etc... para depois dar o @import das seguintes páginas.

Se o meu entendimento está correto, talvez vc esteja colocando o import antes da criação dos mixins.

Caso não seja isso, veja qual o erro que está aparecento.

Fiz um teste simulando o erro comentado, coloquei o @import no inicio da página e obtive o seguinte erro:

Error: Undefined variable.
   ╷
16 │             border-top: 1px solid $light-grey;
   │                                   ^^^^^^^^^^^
   ╵
  scss\_header.scss 16:35  @import
  scss\style.scss 2:9      root stylesheet

Esse erro aconteceu pq a variável $light-grey ainda não tinha sido criada, pq o import veio antes dela.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software