@@ -878,15 +878,19 @@ This will let Create React App correctly infer the root path to use in the gener
...
@@ -878,15 +878,19 @@ This will let Create React App correctly infer the root path to use in the gener
>Note: this feature is available with `react-scripts@0.2.0` and higher.
>Note: this feature is available with `react-scripts@0.2.0` and higher.
**THE BELOW STEP IS IMPORTANT!**<br>
**If your skip it, your app will not deploy correctly.**
Open your `package.json` and add a `homepage` field:
Open your `package.json` and add a `homepage` field:
```js
```js
"homepage":"https://myusername.github.io/my-app",
"homepage":"https://myusername.github.io/my-app",
```
```
**The above step is important!**<br>
Create React App uses the `homepage` field to determine the root URL in the built HTML file.
Create React App uses the `homepage` field to determine the root URL in the built HTML file.
**Have you added the `homepage` field? Then let's move on.**
Now, whenever you run `npm run build`, you will see a cheat sheet with instructions on how to deploy to GitHub Pages.
Now, whenever you run `npm run build`, you will see a cheat sheet with instructions on how to deploy to GitHub Pages.
To publish it at [https://myusername.github.io/my-app](https://myusername.github.io/my-app), run:
To publish it at [https://myusername.github.io/my-app](https://myusername.github.io/my-app), run:
...
@@ -913,6 +917,8 @@ Then run:
...
@@ -913,6 +917,8 @@ Then run:
npm run deploy
npm run deploy
```
```
**If you see 404 errors for JS and CSS, re-read the note at the beginning of this section saying "THE BELOW STEP IS IMPORTANT".**
You can configure a custom domain with GitHub Pages by adding a `CNAME` file to the `public/` folder.
You can configure a custom domain with GitHub Pages by adding a `CNAME` file to the `public/` folder.
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 because 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:
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 because 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: