Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Diferença de utilizar imagem SVG como SVGR

Não entendi a vantagem de transformar a imagem, que já é um SVG, em um SVGR.

Antes estava assim:

<img src='logo.svg'>

Depois ficou assim:

import {ReactComponent as Logo} from 'logo.svg';

//(...)

<Logo/>
3 respostas

Oi, Maurício! Tudo bom? O React possui esse pacote SVGR que pega imagens SVG e os transforma em componentes React. O instrutor faz essa mudança para evitar ter que usar uma imagem SVG dentro de uma tag img como ele fez antes no exemplo que você mostrou. Ao invés disso, ele importa a imagem SVG como um SVG puro utilizando o pacote SVGR, e o utiliza no código como um componente React. Se quiser saber mais sobre SVGR só clicar aqui e acessar a documentação.

Fala, Neilson. O que não entendi é se existe alguma vantagem em fazer isso, ou se ele só fez para fins didáticos.

solução!

Entendi. Sim, fazer dessa forma possui algumas vantagens, entre elas otimização. Mas te convido a leitura de alguns artigos que explicam muito melhor tais vantagens do SVGR.