Placing an image with in a React component

Question

I am using an React component with the following code:

import React from 'react'
import './styles.css'
import logo from './icons/logo.svg'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faMapMarkerAlt, faShoppingBag } from '@fortawesome/free-solid-svg-icons'


const Header = () => 
    <header id="main-header">
        <div id="header-topo">
            <div className="icon">
                <FontAwesomeIcon icon={faMapMarkerAlt} />
            </div>
            <div className="texto-esquerda flex-item-1">
                Nossas Lojas
            </div>
            <nav className="texto-direita flex-item-1 crumbs">
                <ol>
                    <li className="crumb">My Blue's 0</li>
                    <li className="crumb icon"><FontAwesomeIcon icon={faShoppingBag} /></li>
                    <li className="crumb cadastre-se">Sign in | Cadastre-se</li>
                </ol>
            </nav>
        </div>
        <div id="header-med">
            <nav className="texto-centro flex-item-1 crumbs">
                <ol>
                    <li className="crumb item-nav">Feminino</li>
                    <li className="crumb item-nav">Masculino</li>
                    <li className="crumb item-nav">Mini</li>
                    <li className="crumb item-nav img-logo"><img src="{logo}" alt="Alguma coisa"/></li>
                    <li className="crumb item-nav">Gifts</li>
                    <li className="crumb item-nav">Brides</li>
                    <li className="crumb item-nav">Sale</li>

                </ol>
            </nav>
        </div>
    </header>;

export default Header;

the image does not load and the console presents the error that I am not using the import of "logo", someone could help me?

Answer 1

Your import returns a variable, do not need to use the "

<img src={logo} alt="Alguma coisa"/>