Search code examples
javascriptreactjscomponentssrcimgsource

Having issues with my img src using React

I'm trying to use an image of a search icon on my site, but it's not loading. I keep making sure my directory to the image is correct and it all looks good to me. I am currently in my Navbar>Index.js file and trying to get to my folder assets/icons/search.png

                    <img src={require('../../assets/icons/search.png')} alt="Search" />

my directory

image not loading on my site

Solution

  • In React you have to first import the image before you can use it.

    import Image from '../../assets/icons/search.png'

    Then you can use it like this

    <img src={Image} alt="Search" />