Github pages vite JS build not showing the images

I had the same problem, I solved it by adding the images in the public folder inside the root instead of the src folder, like this public/assets/img

and the img src will be like this <img src="/assets/img/downlaod.png" />

 ─┬root
  |
  ├─public/assets/img
  ├─src
  ├─.gitignore
  ├─vite.config.js
  ├─README.md
  ├─dist
  ├─.yarn

I found the problem. It was in the loading. For example

const spaceTexture = new THREE.TextureLoader().load("./images/space.jpg");

The problem was in the patch I tried ("./images/space.jpg"); or ("/images/space.jpg"); but these working only local, doesn't work in github pages.

The correct way is without any dash or dot and

("images/space.jpg");

it is quite simple, if you don't want to read the Vite documentation here https://vitejs.dev/guide/assets.html#the-public-directory I can save you time)))

Just create a public directory, build your project and you will see all your images in the "dist" directory by the same path but without the "public" prefix

here is a code example of how to render images, but note that you wouldn't see it in the developer environment (it is normal according to Vite documentation)

<img
    loading="lazy" <--- not necessary 
    src={`/icons/flags/${dynamicImageName}.png`} <--- here 
/>