Skip to content

Commit

Permalink
Document multiple build environments via env-cmd #4071 (#4117)
Browse files Browse the repository at this point in the history
* Docs - Document multiple build environments via

* Docs - Document multiple build environments via

* Docs - Document multiple build environments via

* Docs - Document multiple build environments via env-cmd

* fix - based upon requests

* Update README.md
  • Loading branch information
Jerry Muzsik authored and Timer committed Apr 15, 2018
1 parent 14f4485 commit fc2f63a
Showing 1 changed file with 29 additions and 0 deletions.
29 changes: 29 additions & 0 deletions packages/react-scripts/template/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,7 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [Serving Apps with Client-Side Routing](#serving-apps-with-client-side-routing)
- [Service Worker Considerations](#service-worker-considerations)
- [Building for Relative Paths](#building-for-relative-paths)
- [Customizing Environment Variables for Arbitrary Build Environments](#customizing-environment-variables-for-arbitrary-build-environments)
- [Azure](#azure)
- [Firebase](#firebase)
- [GitHub Pages](#github-pages)
Expand Down Expand Up @@ -2211,6 +2212,34 @@ If you are not using the HTML5 `pushState` history API or not using client-side
This will make sure that all the asset paths are relative to `index.html`. You will then be able to move your app from `http://mywebsite.com` to `http://mywebsite.com/relativepath` or even `http://mywebsite.com/relative/path` without having to rebuild it.

### Customizing Environment Variables for Arbitrary Build Environments

You can create an arbitrary build environment by creating a custom `.env` file and loading it using [env-cmd](https://www.npmjs.com/package/env-cmd).

For example, to create a build environment for a staging environment:

1. Create a file called `.env.staging`
1. Set environment variables as you would any other `.env` file (e.g. `REACT_APP_API_URL=http://api-staging.example.com`)
1. Install [env-cmd](https://www.npmjs.com/package/env-cmd)
```sh
$ npm install env-cmd --save
$ # or
$ yarn add env-cmd
```
1. Add a new script to your `package.json`, building with your new environment:
```json
{
"scripts": {
"build:staging": "env-cmd .env.staging npm run build",
}
}
```

Now you can run `npm run build:staging` to build with the staging environment config.
You can specify other environments in the same way.

Variables in `.env.production` will be used as fallback because `NODE_ENV` will always be set to `production` for a build.

### [Azure](https://azure.microsoft.com/)

See [this](https://medium.com/@to_pe/deploying-create-react-app-on-microsoft-azure-c0f6686a4321) blog post on how to deploy your React app to Microsoft Azure.
Expand Down

0 comments on commit fc2f63a

Please sign in to comment.