Skip to content

Commit 5a0669a

Browse files
rafgraphgaearon
authored andcommitted
Add note that router doesn't work with gh-pages (#279)
* Add note that router doesn't work with gh-pages * Update note about using router with gh-pages
1 parent bbce803 commit 5a0669a

File tree

1 file changed

+4
-0
lines changed

1 file changed

+4
-0
lines changed

template/README.md

+4
Original file line numberDiff line numberDiff line change
@@ -346,6 +346,10 @@ git checkout -
346346

347347
You may copy and paste them, or put them into a custom shell script. You may also customize them for another hosting provider.
348348

349+
Note that GitHub Pages doesn't support routers that use the HTML5 `pushState` history API under the hood (for example, React Router using `browserHistory`). This is becasue when there is a fresh page load for a url like `http://user.github.io/todomvc/todos/42`, where `/todos/42` is a frontend route, the GitHub Pages server returns 404 because it knows nothing of `/todos/42`. If you want to add a router to a project hosted on GitHub Pages, here are a couple of solutions:
350+
* You could switch from using HTML5 history API to routing with hashes. If you use React Router, you can switch to `hashHistory` for this effect, but the URL will be longer and more verbose (for example, `http://user.github.io/todomvc/#/todos/42?_k=yknaj`). [Read more](https://github.com/reactjs/react-router/blob/master/docs/guides/Histories.md#histories) about different history implementations in React Router.
351+
* Alternatively, you can use a trick to teach GitHub Pages to handle 404 by redirecting to your `index.html` page with a special redirect parameter. You would need to add a `404.html` file with the redirection code to the `build` folder before deploying your project, and you’ll need to add code handling the redirect parameter to `index.html`. You can find a detailed explanation of this technique [in this guide](https://github.com/rafrex/spa-github-pages).
352+
349353
### Something Missing?
350354

351355
If you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/template/README.md)

0 commit comments

Comments
 (0)