github 页面的 React 应用程序

React application for github pages

我的 React 项目有下一个 github 回购:https://github.com/AlexeyVolosnikov/livedune-test

然后我尝试将它放在 github 页面中,接下来的步骤是:

  1. 已创建分支 gh-pages
  2. package.json 我添加了 "homepage" : "https://AlexeyVolosnikov.github.io/livedune-test""predeploy": "npm run build", "deploy": "gh-pages -d build"
  3. npm run deploy

但是 npm run deploy 引发错误:

C:\Users\Horseman.mini\PhpstormProjects\livedune-test>npm run deploy

> livedune-test@0.1.0 predeploy C:\Users\Horseman.mini\PhpstormProjects\livedune-test
> npm run build


> livedune-test@0.1.0 build C:\Users\Horseman.mini\PhpstormProjects\livedune-test
> react-scripts build

Creating an optimized production build...
Compiled with warnings.

src\forms\AuthForm\AuthForm.js
  Line 1:16:  'Component' is defined but never used  no-unused-vars

src\forms\RegForm\RegForm.js
  Line 1:16:   'Component' is defined but never used       no-unused-vars
  Line 13:8:   'handleSubmit' is defined but never used    no-unused-vars
  Line 33:13:  'error' is assigned a value but never used  no-unused-vars

src\pages\ForgotPassword\ForgotPassword.js
  Line 1:16:  'Component' is defined but never used  no-unused-vars

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

File sizes after gzip:

  74.63 KB  build\static\js.5b24fd1e.chunk.js
  5.77 KB   build\static\js\main.796bedc2.chunk.js
  1.56 KB   build\static\css\main.38c57f32.chunk.css
  785 B     build\static\js\runtime-main.3b88d740.js

The project was built assuming it is hosted at /livedune-test/.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.

Find out more about deployment here:

  https://cra.link/deployment


> livedune-test@0.1.0 deploy C:\Users\Horseman.mini\PhpstormProjects\livedune-test
> gh-pages -d build

git-upload-pack '.': git-upload-pack: command not found
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! livedune-test@0.1.0 deploy: `gh-pages -d build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the livedune-test@0.1.0 deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Horseman.mini\AppData\Roaming\npm-cache\_logs21-02-07T16_20_21_683Z-debug.log

我尝试使用 this article 来完成,但没有任何结果。我只是尝试 post 它 1 小时,但对它无能为力,如果有人能提供帮助,我将不胜感激 :)

更新 1 我确实通过 git bash 成功部署了 ,感谢 this answer,但它仍然显示一个空白页面,怎么了?

我想这对以后的人会有帮助。如何 post 您的网站对 github 页面做出反应:

  1. 在您的 package.json 中添加 homepage" : "https://<username>.github.io/<project-name>" 并在脚本字典中添加 "predeploy": "npm run build""deploy": "gh-pages -d build"。你的 github 用户名和你的项目名称在哪里。
  2. 创建分支 gh-pages 并进入 git bash terminal(windows 中的 cmd 可能会导致错误,如我的问题)并写入:npm run deploy
  3. 转到 repo 分支设置并检查是否在 github 页块中选择了 gh-pages 分支。
  4. 稍等一分钟,刷新页面,进入绿框link

我关于空白页的第二个错误是因为我需要在 App.js 中更改 BrowserRouter 中的确切路径,它是“/”,但需要是“/project-name”