Github Pages站点访问仅显示标题其余区域全白故障排查咨询

• 基础路径配置错误（最高发）：你的站点部署在/UHD-Food-Market/子路径下，不是域名根目录。如果项目打包时没有对应修改基础路径配置：
  • Vite项目需在vite.config.js中添加base: '/UHD-Food-Market/'配置项
  • React项目需在package.json中添加"homepage": "https://h4ywyre.github.io/UHD-Food-Market/"字段
  • Vue项目需在配置文件中修改publicPath为/UHD-Food-Market/
    未配置的情况下，打包后的js、css资源会请求根路径下的文件，触发404加载失败，浏览器无内容可渲染就会显示全白，仅保留HTML里预设的页面标题。
• 路由模式不兼容：如果是单页应用且使用了BrowserRouter（History路由模式），Github Pages原生不支持该路由模式的解析，也会直接导致白屏，替换为HashRouter后重新打包部署即可解决。
• 部署产物错误：检查gh-pages分支下存放的是否是项目编译打包后生成的dist目录内的全部文件，若误传了源码文件而非编译后的可执行静态资源，也会出现该故障。

快速验证方式 #

打开站点后按F12调出开发者工具，切换到控制台面板，如果存在静态资源404、脚本加载失败的报错，即可直接判定为路径配置问题。

内容的提问来源于stack exchange，提问作者SUB_ROSA