Document what npm build does and pushState #933
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! If you are contributing on behalf of someone else (eg your employer): the individual CLA is not sufficient - use https://developers.facebook.com/opensource/cla?type=company instead. Contact cla@fb.com if you have any questions. |
|
Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks! |
| @@ -863,7 +863,20 @@ This feature is experimental and still [has major usage issues](https://github.c | |||
|
|
|||
| ## Deployment | |||
|
|
|||
| ## Building for Relative Paths | |||
| `npm run build` creates a `build` directory with a production build of your app. Set up your favourite http server so that a visitor to your site is served `index.html`, and requests to static paths like `/static/js/main.<hash>.js` is served with the contents of the `/static/js/main.<hash>.js` file. | |||
There was a problem hiding this comment.
Please uppercase HTTP.
requests [...] are served
| @@ -863,7 +863,20 @@ This feature is experimental and still [has major usage issues](https://github.c | |||
|
|
|||
| ## Deployment | |||
|
|
|||
| ## Building for Relative Paths | |||
| `npm run build` creates a `build` directory with a production build of your app. Set up your favourite http server so that a visitor to your site is served `index.html`, and requests to static paths like `/static/js/main.<hash>.js` is served with the contents of the `/static/js/main.<hash>.js` file. | |||
|
|
|||
There was a problem hiding this comment.
This jumps to an example too abruptly. Maybe mention "For example, you can serve static files with Python:"?
And then maybe add an Express example.
|
|
||
| If you use routers that use the HTML5 `pushState` history API under the hood (for example, React Router using `browserHistory`), many static file servers will fail. For example, if you used react-router with a route for `/todos/42`, the development server will respond to `localhost:3000/todos/42` properly, but the python3 http.server serving a production build as above will not. | ||
|
|
||
| This is because when there is a fresh page load for a `0.0.0.0/todos/42`, the server looks for the file `build/todos/42` and does not find it. The server needs to be configured to respond to a request to `/todos/42` by serving `index.html`. |
There was a problem hiding this comment.
This describes the problem but doesn't describe the solution.
There was a problem hiding this comment.
I believe this describes the solution
The server needs to be configured to respond to a request to
/todos/42by servingindex.html.
The way to configure the server to do so depends on the server used; there's some server-specific information, eg in the Github Pages section.
|
Slightly tweaked and merged. Thank you so much! |
* master: (30 commits) Relax peerDependencies for ESLint preset (facebook#1191) Update Webpack to fix source map issues (facebook#1188) Update webpack prod config (facebook#1181) Chrome 'open tab' reuse an empty tab when possible (facebook#1165) Use file-loader for svgs (facebook#1180) Fix Babel issues in tests by applying the right transforms (facebook#1179) [babel-preset-react-app] Temporary fix missing babel plugins (facebook#1177) Add Subresource Integrity support (facebook#1176) Remove path module from webpack config on eject. (facebook#1175) Don't strip stack traces of evaluated webpack bundles (facebook#1050) Add deploy to Firebase CDN on template's README (Closes facebook#374) (facebook#1143) Update e2e.sh (facebook#1167) Document what npm build does and pushState (facebook#933) Fix minor typo/grammar (facebook#1099) Add "npm run build silently fails" to Troubleshooting (facebook#1168) Add testURL to jest config (facebook#1120) Make jsx-no-undef rule an error (facebook#1159) Update CHANGELOG.md Publish Update changelog for 0.8.1 ...
* Document what npm build does and pushState * Fix typos, add express example * Tweaks * Update README.md
* Document what npm build does and pushState * Fix typos, add express example * Tweaks * Update README.md
The User Guide does not actually document what
npm run builddoes. The docs also don't describe how exactly to "deploy" the resultingbuilddirectory.This PR describes what
npm run builddoes and what it means to deploy the build in the Users Guide.Additionally, it describes the
pushStategotcha which was previously only described in reference to specific servers (eg github pages).