2

I'm trying to deploy a react app to github. I followed some simple tutorials pretty much to the letter, but always get stuck on this screen. Found some old threads that recommended to remove and re-add the remote origin, but that did not seem to help.

CMD Screenshot

1 Answers1

2

Met a similar challenge recently, and not many answers nail it. Most blogs will show you how to about it from a create-react-app concept, but outside that you are more less on your own.

Here is a quick one:

  1. First, make sure you understand the commands that you are running. Needless to say, i also error-ed at first, so... gh-pages -d build literally means you want to "publish your page" based on a folder "build/". That's what the -d or --dirmeans. read more here [install and use gh-pages-cli][1]. So start by either making sure you have the folder "build/" or better point it to where the files you want to bundle are located in your project.
    [Have a look at scripts in my package.json file][2] (incase you are curious, the
    -b`` means the branch you want to "publish" from).

  2. If the above does not solve your issue, just like for me, because the command published successfully but i still kept getting a 404 Error when i tried accessing the page on https://<my-username>/github.io/<my-repository>/.

    So here is the alternative i used:

    • Create a new branch gh-pages from the branch which has the project version that you want to publish.
    • Run git push origin gh-pages to push that branch to your remote repository which is hosted on github.
    • Note that github is configured to publish any project code that you have in this branch - gh-pages. Confirm this by clicking the settings tab in your repo, and if you navigate down, you'll see something like this under the heading "Github Pages".
    • Some key things to remember: One, your index.html (main template) must be within your project root folder directly (not under subfolders). My project root folder was /fast-React/ so i placed my index page at /fast-React/index.html. And second, commit your bundled/build files. In most projects, bundled/build files are added to .gitignore so you better commit them, at least within this gh-pages branch. Here is why - they need to be fetched by your <script> tag, most likely.

See this test project as published here. Good luck.

MwamiTovi
  • 2,425
  • 17
  • 25