My images dont appear in my built app

Support
1

Hello guys my images don´t appear in my react app after deploy , here is how the images are being called

        const { default: image } = await import(imagePath);
        setImageSrc(image);
      } catch (error) {
        console.error('error to load the image:', error);
      }
    };
  
    loadImage();
  }, [props.photo]);

in localhost the images load with no problem and in after the deploy when I open the aplication in the console I have a link that takes me to the image but the image is not being shown

Screenshot from 2023-06-02 10-41-47
Screenshot from 2023-06-02 10-41-471359×460 167 KB

this is what is logged in the console in my aplication after the deploy
index-f6236dee.js:71 Erro ao carregar a imagem: TypeError: Failed to fetch dynamically imported module: https://6479fe54ba4f50151360e63d--peppy-fudge-3cf4c4.netlify.app/images/Partners/Ceonc.jpeg
(anonymous) @ index-f6236dee.js:71

  useEffect(() => {
    const loadImage = async () => {
      try {
        const imagePath = import.meta.env.PROD
          ? `${import.meta.env.BASE_URL}images/${props.photo}`
          : `../../public/images/${props.photo}`;
2

Hiya, this is a common problem for many I recommend you check through the forums and try the many proposed solutions. Here’s a good example:

3

Man while I posted this I’m trying to resolve this searching in the forums , but thanks for nothing kkkkkkkkkk

4

The linked site doesn’t seem to exist. Has something changed?

5

I have deleted this one and done a deploy from my github
https://joyful-yeot-3be52e.netlify.app/
my github
git@github.com:teusmamf/estacionamentoRot.git

6

You should not be importing files from public. Simply link to those images like: /images/${props.photo}

7

like this /images/${props.photo} still not working I’m trying now like that ./images/${props.photo}

8

Sorry for not being clear. You should not be importing the images at all. Just use the src attribute of images as /images/${props.photo}.

9

I’m trying now , but i local host the images dont load I update you

10

I tried that way

<div className='card_single'>
      <div className='img_and_info'>
      <img src={`./images/${props.photo}`} alt={props.Address} className='img_card' />
      <div className="name">{props.Address}<br></br>
        {props.complement} </div>
     
      <div className="contact">
        {props.contact}<br></br>
        {props.func}
        </div>
    
      </div>

and that way /images/${props.photo}

but still not working

11

The images appear to be loading now.

12

I did it , thanks for the attention man