Github 页面 vite JS 构建不显示图像答案

【问题标题】：Github pages vite JS build not showing the imagesGithub 页面 vite JS 构建不显示图像
【发布时间】：2026-01-11 00:05:01
【问题描述】：

我正在尝试使用 Github 页面制作简单的作品集，但图片有问题。我无法加载它们。你能帮我解决这个问题吗？

这是我的构建文件夹。我使用了 Vite 和三个库 https://github.com/xakepa/Portfolio/tree/main/dist

【问题讨论】：

【解决方案1】：

我遇到了同样的问题，我通过在root 中添加public folder 中的图像而不是src folder 来解决它，就像这样public/assets/img

img src 会是这样的 <img src="/assets/img/downlaod.png" />

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

【讨论】：

【解决方案2】：

我发现了问题。它在装载中。例如

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

问题出在我尝试的补丁中（“./images/space.jpg”）；或 ("/images/space.jpg");但这些只能在本地工作，不能在 github 页面中工作。

正确的做法是不加破折号和

("images/space.jpg");

【讨论】：