Add note that router doesn't work with gh-pages #279
Conversation
|
Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file. In order for us to review and merge your code, please sign up at https://code.facebook.com/cla - and if you have received this in error or have any questions, please drop us a line at cla@fb.com. Thanks! |
|
Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks! |
ghost
added
the
| @@ -346,6 +346,8 @@ git checkout - | |||
|
|
|||
| You may copy and paste them, or put them into a custom shell script. You may also customize them for another hosting provider. | |||
|
|
|||
| Note that if you add a router your app won't work with GitHub Pages becasue it doesn't natively support single page apps with frontend routing (unless it's the ugly hashtag kind). There is a simple workaround for this by adding a `404.html` file with a redirect script, see [Single Page Apps for GitHub Pages](https://github.com/rafrex/spa-github-pages). | |||
There was a problem hiding this comment.
Let’s make it clear that it’s not an inherent problem with routers. It’s only relevant for the routers using HTML5 pushState history API under the hood. (I know you know it, but our readers probably won’t.)
There was a problem hiding this comment.
Let’s also avoid words like “simple” and “ugly”. They are very subjective. I would rather have a list of workarounds, like this:
- You could switch from using HTML5 history API to routing with hashes. The URL will be longer and more verbose (for example,
http://user.github.io/todomvc#todos/42). If you use React Router, you can switch tohashHistoryfor this effect. Read more about different history implementations in React Router. - Alternatively, you can use a trick to teach GitHub Pages to handle 404 by redirecting to your
index.htmlpage with a special parameter. You would need to add an404.htmlfile with the redirection code to thebuildfolder before deploying your project, and you’ll need to add code handling that parameter toindex.html. You can find a detailed explanation of this technique in this guide.
There was a problem hiding this comment.
Yea that makes sense. I wasn't sure how much detail you wanted in the note since create-react-app doesn't include a router by default. I agree "simple" and "ugly" are more appropriate for a subjective comment than an objective doc.
|
@gaearon I updated the note about using a router with GitHub Pages, let me know what you think. I liked what you wrote, so I used a bunch of it in the update. Also, sorry about the |
|
Looking good, thank you so much! |
No description provided.