Github Pages部署React应用空白：自定义域名移除后异常排查

为什么会出现这种情况？ #

你在GitHub Pages添加自定义域名时，仓库会自动生成一个CNAME文件。哪怕后来在GitHub设置里移除了域名，只要这个文件没手动删除，GitHub Pages就会优先读取CNAME里的旧域名配置，进而引发两个问题：

• 页面会尝试跳转到已解绑的自定义域名，加载失败后显示空白
• 如果旧自定义域名用的是HTTP协议，而GitHub Pages默认是HTTPS，浏览器就会阻止从HTTPS页面加载HTTP资源，触发混合内容错误

恢复步骤 #

• 打开仓库aermkv/portfolio2023，检查根目录是否存在CNAME文件，直接删除该文件后提交并推送到远程仓库。
• 进入GitHub仓库的「Settings」→「Pages」页面，确认「Custom domain」输入框已清空，且「Source」选择的分支和目录（比如gh-pages分支或main分支的/build目录）设置正确。
• 检查React项目的package.json，确保homepage字段设为https://aermkv.github.io/portfolio2023/，然后重新执行npm run build构建项目，把build文件夹的内容推送到部署分支。
• 等待5-10分钟让GitHub Pages完成重新部署，之后刷新页面即可恢复正常访问。

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