部署ReactJS应用至gh-pages后显示空白页（已解决）

你提供的manifest.json语法完全合法，控制台出现的Manifest: Line: 1, column: 1, Syntax error错误，通常不是文件内容写错了，而是浏览器请求该文件时拿到的不是正确的JSON内容（比如返回了HTML页面，比如404页面），进而导致解析失败，可能引发页面空白。

以下是常见的问题原因及解决办法：

• 子路径适配问题
  部署到GitHub Pages的项目如果是放在username.github.io/repo-name这类子路径下，需要：

  1. 在项目的package.json中添加"homepage": "https://你的用户名.github.io/你的仓库名"，Create React App会自动调整所有资源的引用路径。
  2. 将manifest.json里的start_url从.修改为/你的仓库名/，确保应用启动路径正确。

• Manifest文件部署异常
  检查gh-pages分支中是否存在manifest.json文件，且位置在正确的部署路径下。部分情况下部署脚本可能漏传了该文件，或者路径配置错误导致浏览器找不到它，服务器返回404的HTML页面，浏览器把HTML当成JSON解析就会触发语法错误。

• 缓存干扰
  浏览器缓存了旧的错误资源也可能导致问题，尝试用Ctrl+Shift+R强制刷新页面，或者使用无痕模式访问验证。

验证小技巧：直接在浏览器地址栏访问manifest.json的完整URL（比如https://你的用户名.github.io/你的仓库名/manifest.json），查看返回内容是否为正确的JSON。如果返回的是HTML页面，那肯定是路径或部署环节出了问题。

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