无法将 ReactJS 应用程序部署到 github 页面

Question

嘿，这几天我一直在尝试这个，我已经阅读了所有文档，我按照教程进行操作，但在尝试将我的 react 应用程序部署到 github 页面时，我无法通过 npm run deploy。我调用 npm run build，将 package.json 的正确 URL 作为“主页”，我再次调用它并获取“部署”和“预部署”，我在节点模块中肯定有 gh-pages，我的意思是我得到了这一切我都遵循了每个教程可以告诉我的每一步。我遇到了一个问题，内容如下：

错误：无法生成 sh：没有这样的文件或目录致命：无法 分叉

npm 错误！代码 ELIFECYCLE npm 错误！ errno 1 npm 错误！ carlos_valencia_portfolio@0.1.0 部署：gh-pages -d build npm ERR！ 退出状态 1 npm ERR！ npm 错误！失败了 carlos_valencia_portfolio@0.1.0 部署脚本。 npm 错误！这是 npm 可能不是问题。可能有额外的日志记录 上面的输出。

npm 错误！可以在以下位置找到此运行的完整日志：npm ERR！
C:\Users\Carlos\AppData\Roaming\npm-cache_logs\2018-10-04T19_57_57_731Z-debug.log

以下是日志内容：

0 信息如果它以 ok 结尾，它就会起作用 1个详细的cli ['C：\ Program Files \ nodejs \ node.exe'， 1 详细的 cli 'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js', 1个详细的cli“运行”， 1个详细的cli'部署'] 2 使用 npm@6.2.0 的信息 3 使用 node@v10.8.0 的信息 4个详细的运行脚本['predeploy'，'deploy'，'postdeploy'] 5 信息生命周期 carlos_valencia_portfolio@0.1.0~predeploy: carlos_valencia_portfolio@0.1.0 6 详细生命周期 carlos_valencia_portfolio@0.1.0~predeploy: unsafe-perm in lifecycle true 7 详细生命周期 carlos_valencia_portfolio@0.1.0~predeploy: PATH: C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\Users\Carlos\ReactJSProjects\carlos_valencia_portfolio\node_modules。 bin;C:\ProgramData\Oracle\Java\javapath;C:\Program Files (x86)\Intel\iCLS Client\;C:\Program Files\Intel\iCLS Client\;C:\WINDOWS\system32;C:\ WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\Intel(R) Management Engine Components \IPT;C:\Program Files\dotnet\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files\Microsoft SQL Server\110\DTS\Binn\;C:\Program文件 (x86)\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\ 110\Tools\Binn\ManagementStudio\;C:\Program Files (x86)\Microsoft Visual Studio 10.0\Common7\IDE\PrivateAssemblies\;C:\Program Files (x86)\Microsoft SQL Server\110\DTS\Binn\; C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\;C:\WINDOWS\System32\OpenSSH\;C:\Program Files\nodejs\;C:\Program Files\Git\cmd;C:\Users\Carlos\AppData\Local\Microsoft\WindowsApps;C:\Users\Carlos\AppData\Roaming\npm;C:\Users\Carlos\AppData\Local\atom\bin;C :\Users\Carlos\AppData\Local\GitHubDesktop\bin 8 详细生命周期 carlos_valencia_portfolio@0.1.0~predeploy: CWD: C:\Users\Carlos\ReactJSProjects\carlos_valencia_portfolio 9 愚蠢的生命周期 carlos_valencia_portfolio@0.1.0~predeploy: Args: [ '/d /s /c', 'npm run build' ] 10 愚蠢的生命周期 carlos_valencia_portfolio@0.1.0~predeploy：返回：代码：0 信号：null 11 信息生命周期 carlos_valencia_portfolio@0.1.0~部署：carlos_valencia_portfolio@0.1.0 12 详细生命周期 carlos_valencia_portfolio@0.1.0~deploy: unsafe-perm in lifecycle true 13 详细生命周期 carlos_valencia_portfolio@0.1.0~deploy: PATH: C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\Users\Carlos\ReactJSProjects\carlos_valencia_portfolio\node_modules。 bin;C:\ProgramData\Oracle\Java\javapath;C:\Program Files (x86)\Intel\iCLS Client\;C:\Program Files\Intel\iCLS Client\;C:\WINDOWS\system32;C:\ WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\Intel(R) Management Engine Components \IPT;C:\Program Files\dotnet\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files\Microsoft SQL Server\110\DTS\Binn\;C:\Program文件 (x86)\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\11 0\Tools\Binn\ManagementStudio\;C:\Program Files (x86)\Microsoft Visual Studio 10.0\Common7\IDE\PrivateAssemblies\;C:\Program Files (x86)\Microsoft SQL Server\110\DTS\Binn\; C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\;C:\WINDOWS\System32\OpenSSH\;C:\Program Files\nodejs\;C:\Program Files\Git\cmd;C:\Users\Carlos\AppData\Local\Microsoft\WindowsApps;C:\Users\Carlos\AppData\Roaming\npm;C:\Users\Carlos\AppData\Local\atom\bin;C :\Users\Carlos\AppData\Local\GitHubDesktop\bin 14 详细生命周期 carlos_valencia_portfolio@0.1.0~deploy: CWD: C:\Users\Carlos\ReactJSProjects\carlos_valencia_portfolio 15 愚蠢的生命周期 carlos_valencia_portfolio@0.1.0~deploy: Args: [ '/d /s /c', 'gh-pages -d build' ] 16 愚蠢的生命周期 carlos_valencia_portfolio@0.1.0~deploy：返回：代码：1 信号：null 17 info 生命周期 carlos_valencia_portfolio@0.1.0~deploy: 执行部署脚本失败 18 详细堆栈错误：carlos_valencia_portfolio@0.1.0 部署：gh-pages -d build 18 详细堆栈退出状态 1 EventEmitter 的 18 个详细堆栈。 (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:304:16) EventEmitter.emit (events.js:182:13) 的 18 个详细堆栈 ChildProcess 的 18 个详细堆栈。 （C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14） ChildProcess.emit (events.js:182:13) 的 18 个详细堆栈 MaybeClose 的 18 个详细堆栈 (internal/child_process.js:962:16) Process.ChildProcess._handle.onexit (internal/child_process.js:249:5) 的 18 个详细堆栈 19 详细 pkgid carlos_valencia_portfolio@0.1.0 20 详细 cwd C:\Users\Carlos\ReactJSProjects\carlos_valencia_portfolio 21 详细的 Windows_NT 10.0.17134 22 详细 argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "deploy" 23 详细节点 v10.8.0 24 详细 npm v6.2.0 25 错误代码 ELIFECYCLE 26 错误错误号 1 27 错误 carlos_valencia_portfolio@0.1.0 部署：gh-pages -d build 27 错误 退出状态 1 28 错误 carlos_valencia_portfolio@0.1.0 部署脚本失败。 28 错误 这可能不是 npm 的问题。上面可能有额外的日志输出。 29 详细退出 [1, true]

我不知道发生了什么，我在网上阅读了一些内容，说我没有指向包含我的 sh.exe 的文件夹，我必须在我的环境变量中指定它等等。我真的尝试了我在 google、bing 和 reddit 上找到的所有东西。我真的被难住了，想哭，哈哈。请帮忙！

Answer 1

查看homepage 的package.json 值以及scripts 对象中的predeploy 和deploy 值会很有帮助。话虽如此，以下是如何将 React 应用程序部署到 Github Pages：

• 在构建您的应用程序并推送到您的 github 存储库后，通过在终端中运行以下命令来安装 gh-pages：
  • npm install --save gh-pages

• 使用以下内容更新您的 package.json：

  • "homepage": "https://[github-username].github.io/[repo-name]"
• 在您的 scripts 对象中：
  • "predeploy": "npm run build",
  • "deploy": "gh-pages -d build"
• 运行
  • npm run deploy

Answer 2

如果您可以添加一些代码会很有帮助，但可能值得查看这篇文章的底部回复：

https://github.community/t5/GitHub-Pages/My-react-project-doesn-t-work-on-github-pages/m-p/6806#M452

特别是关于客户端路由的这一部分（如果适用于您的应用程序）：

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#notes-on-client-side-routing