|
|
|
@ -0,0 +1,44 @@
|
|
|
|
|
# Deployment
|
|
|
|
|
|
|
|
|
|
npm run build creates a build directory with a production build of your app. Set up your favorite HTTP server so that a visitor to your site is served index.html, and requests to static paths like `/static/js/main.<hash>.js` are served with the contents of the `/static/js/main.<hash>.js` file. For more information see the production build section.
|
|
|
|
|
|
|
|
|
|
### Static Server
|
|
|
|
|
For environments using Node, the easiest way to handle this would be to install serve and let it handle the rest:
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
npm install -g serve
|
|
|
|
|
serve -s build
|
|
|
|
|
```
|
|
|
|
|
The last command shown above will serve your static site on the port 5000. Like many of serve’s internal settings, the port can be adjusted using the -l or --listen flags:
|
|
|
|
|
|
|
|
|
|
`serve -s build -l 4000`
|
|
|
|
|
Run this command to get a full list of the options available:
|
|
|
|
|
|
|
|
|
|
`serve -h`
|
|
|
|
|
|
|
|
|
|
### Other Solutions
|
|
|
|
|
You don’t necessarily need a static server in order to run a Create React App project in production. It also works well when integrated into an existing server side app.
|
|
|
|
|
|
|
|
|
|
Here’s a programmatic example using Node and Express:
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
const express = require('express');
|
|
|
|
|
const path = require('path');
|
|
|
|
|
const app = express();
|
|
|
|
|
|
|
|
|
|
app.use(express.static(path.join(__dirname, 'build')));
|
|
|
|
|
|
|
|
|
|
app.get('/', function (req, res) {
|
|
|
|
|
res.sendFile(path.join(__dirname, 'build', 'index.html'));
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
app.listen(9000);
|
|
|
|
|
```
|
|
|
|
|
The choice of your server software isn’t important either. Since Create React App is completely platform-agnostic, there’s no need to explicitly use Node.
|
|
|
|
|
|
|
|
|
|
The build folder with static assets is the only output produced by Create React App.
|
|
|
|
|
|
|
|
|
|
However this is not quite enough if you use client-side routing. Read the next section if you want to support URLs like /todos/42 in your single-page app.
|
|
|
|
|
|
|
|
|
|
For more information:
|
|
|
|
|
https://create-react-app.dev/docs/deployment/#other-solutions
|