你目前遇到了两个核心问题：一是gh-pages命令未被识别导致部署脚本执行失败，二是GitHub Pages访问出现404错误。下面一步步帮你搞定：

1. 修复gh-pages未被识别的报错 #

你的部署脚本gh-pages -d build依赖gh-pages这个npm工具包，但你的package.json里并没有安装它，这就是终端报错的直接原因。

执行以下命令，把它作为开发依赖安装到项目中：

npm install --save-dev gh-pages

2. 修正homepage字段的配置 #

你现在的homepage填的是仓库地址，这不符合Create React App的要求——这个字段需要填写GitHub Pages的实际访问URL，否则项目部署后会因为资源路径错误出现404。

把package.json里的homepage改成：

"homepage": "https://InquisitiveDev2016.github.io/ReactDeveloperPortfolio"

也可以用更简洁的相对路径形式：

"homepage": "/ReactDeveloperPortfolio"

3. 重新执行部署命令 #

安装好依赖并修正配置后，回到项目目录，重新运行部署脚本：

npm run deploy

这个命令会先执行predeploy里的npm run build生成最新的构建文件，再通过gh-pages工具把build目录的内容推送到GitHub仓库的gh-pages分支。

4. 正确开启GitHub Pages解决404 #

之前开启后出现404，大概率是因为没选对部署分支：

• 打开你的仓库页面，进入Settings标签页
• 往下找到GitHub Pages区域
• 在Source下拉菜单中选择gh-pages分支，点击保存
• 等待3-5分钟让GitHub完成部署，再访问页面就不会出现404了

补充说明： #

你的build文件已经准备就绪，大小也在合理范围内，只要配置正确就能正常上线；部署完成后，访问地址就是你设置的homepage对应的URL，而非仓库的代码地址。

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