使用Github Pages部署Three.js网站遭遇404错误求助

• 确认Vite的base配置
  GitHub Pages项目站点的base路径必须匹配仓库名称，比如你的仓库是portfolio，需在vite.config.js中添加：

  export default {
    base: '/portfolio/'
  }
  

  修改后重新执行npm run build生成新的dist文件，再推送至gh-pages分支。

• 检查gh-pages分支的文件结构
  确保gh-pages分支根目录直接包含index.html、assets等dist内的文件，而非将整个dist文件夹上传。如果根目录只有dist文件夹，GitHub Pages会找不到入口文件。

• 验证资源引用路径
  查看gh-pages分支里的index.html，确认所有.js、.css及Three.js静态资源（模型、纹理等）的引用路径以/portfolio/开头，比如/portfolio/assets/index.xxx.js，避免使用相对路径或根路径/assets/...。

• 核对GitHub Pages部署源设置
  进入仓库Settings → Pages页面，确认部署源选择的是gh-pages分支，且目标目录为根目录（Root），而非/docs或其他目录。

• 查看浏览器控制台的具体错误
  打开部署后的网站，按F12调出控制台，查看404请求的具体资源。如果是模型、纹理等静态资源，需确保这些文件已被打包进dist，且代码中引用路径正确（Vite中静态资源建议放在public目录，或通过import方式导入）。

• 等待缓存刷新
  GitHub Pages部署后可能存在缓存延迟，推送代码后等待5-10分钟再刷新页面尝试。

• 排查自定义域名配置（若有）
  如果使用了自定义域名，需确认域名解析记录正确，且GitHub Pages的自定义域名设置无误，避免因域名跳转导致路径错误。

内容的提问来源于stack exchange，提问作者Autumn Jing Green