From 6de9887ad31fc83f3ad0cf41feff6147be8aed70 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 01:30:56 -0500 Subject: [PATCH 01/12] Add Advanced Configuration section --- packages/react-scripts/template/README.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index c85e544720..399db40b82 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -63,6 +63,7 @@ You can find the most recent version of this guide [here](https://github.com/fac - [Now](#now) - [S3 and CloudFront](#s3-and-cloudfront) - [Surge](#surge) +- [Advanced Configuration](#advanced-configuration) - [Troubleshooting](#troubleshooting) - [`npm start` doesn’t detect changes](#npm-start-doesnt-detect-changes) - [`npm test` hangs on macOS Sierra](#npm-test-hangs-on-macos-sierra) @@ -1289,6 +1290,16 @@ Install the Surge CLI if you haven't already by running `npm install -g surge`. Note that in order to support routers that use HTML5 `pushState` API, you may want to rename the `index.html` in your build folder to `200.html` before deploying to Surge. This [ensures that every URL falls back to that file](https://surge.sh/help/adding-a-200-page-for-client-side-routing). +## Advanced Configuration + +You can adjust various development and production settings via environment variables. + +Variable | Development | Production | Usage +:--- | :---: | :---: | :--- +BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. To override this behavior, the browser may be specified or set to `none` to disable this behavior. +PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. +PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in the `homepage` option. Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using Amazon S3 to host your application. + ## Troubleshooting ### `npm start` doesn’t detect changes From 8e8e48430f067a67244bd859b410a97c93eff4fb Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 01:48:08 -0500 Subject: [PATCH 02/12] Reference package.json instead --- packages/react-scripts/template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 399db40b82..a1711e0008 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1298,7 +1298,7 @@ Variable | Development | Production | Usage :--- | :---: | :---: | :--- BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. To override this behavior, the browser may be specified or set to `none` to disable this behavior. PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. -PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in the `homepage` option. Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using Amazon S3 to host your application. +PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in `package.json` (`homepage`). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using Amazon S3 to host your application. ## Troubleshooting From df055ad9a61c86d523ba3407437abc9a46c9e559 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 11:42:17 -0500 Subject: [PATCH 03/12] Add HOST, HTTPS, and CI --- packages/react-scripts/template/README.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index a1711e0008..3eb08f2c61 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1297,8 +1297,11 @@ You can adjust various development and production settings via environment varia Variable | Development | Production | Usage :--- | :---: | :---: | :--- BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. To override this behavior, the browser may be specified or set to `none` to disable this behavior. +HOST | :white_check_mark: | :x: | By default, the development web server binds to `localhost`. You may use this variable to specify a different host. PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. +HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in `package.json` (`homepage`). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using Amazon S3 to host your application. +CI | :x: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. ## Troubleshooting From 4efa5571c06f93bb55e8115157eccc2b7c272585 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 11:44:29 -0500 Subject: [PATCH 04/12] Switch wording from Amazon to a CDN --- packages/react-scripts/template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 3eb08f2c61..09f1756546 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1300,7 +1300,7 @@ BROWSER | :white_check_mark: | :x: | By default, Create React App will open the HOST | :white_check_mark: | :x: | By default, the development web server binds to `localhost`. You may use this variable to specify a different host. PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. -PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in `package.json` (`homepage`). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using Amazon S3 to host your application. +PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in `package.json` (`homepage`). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application. CI | :x: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. ## Troubleshooting From ecfd2f9bc30d254b560d05e136199246e1ce001a Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 14:51:18 -0500 Subject: [PATCH 05/12] Add test runner comment --- packages/react-scripts/template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 09f1756546..27e76fcbb9 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1301,7 +1301,7 @@ HOST | :white_check_mark: | :x: | By default, the development web server binds t PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in `package.json` (`homepage`). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application. -CI | :x: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. +CI | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. ## Troubleshooting From 0bbab3d7a36e48a699c566d3c515e6d44cc76ed9 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 15:27:10 -0500 Subject: [PATCH 06/12] Add top-level README link --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 85a23174d2..52843b572e 100644 --- a/README.md +++ b/README.md @@ -124,6 +124,7 @@ The [User Guide](https://github.com/facebookincubator/create-react-app/blob/mast - [Developing Components in Isolation](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#developing-components-in-isolation) - [Making a Progressive Web App](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#making-a-progressive-web-app) - [Deployment](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#deployment) +- [Advanced Configuration](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#advanced-configuration) - [Troubleshooting](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#troubleshooting) A copy of the user guide will be created as `README.md` in your project folder. From e194f52ebba6d8d536d527c0372ebadb43cd59aa Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 15:30:17 -0500 Subject: [PATCH 07/12] Simplify wording --- packages/react-scripts/template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 27e76fcbb9..6c19ebaed0 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1296,7 +1296,7 @@ You can adjust various development and production settings via environment varia Variable | Development | Production | Usage :--- | :---: | :---: | :--- -BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. To override this behavior, the browser may be specified or set to `none` to disable this behavior. +BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. Specify a browser to override this behavior, or set it to `none` to disable it completely. HOST | :white_check_mark: | :x: | By default, the development web server binds to `localhost`. You may use this variable to specify a different host. PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. From 9292a4e157a449c7306d50eb66b6c7c960053bd1 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 15:30:29 -0500 Subject: [PATCH 08/12] Link to relevant docs --- packages/react-scripts/template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 6c19ebaed0..a4f4d7d359 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1300,7 +1300,7 @@ BROWSER | :white_check_mark: | :x: | By default, Create React App will open the HOST | :white_check_mark: | :x: | By default, the development web server binds to `localhost`. You may use this variable to specify a different host. PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. -PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in `package.json` (`homepage`). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application. +PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application. CI | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. ## Troubleshooting From 598e29a3647e75eaf6d1bd32dbdcbc866784c870 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 15:31:56 -0500 Subject: [PATCH 09/12] Link to apps --- packages/react-scripts/template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index a4f4d7d359..30cad453a1 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1296,7 +1296,7 @@ You can adjust various development and production settings via environment varia Variable | Development | Production | Usage :--- | :---: | :---: | :--- -BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. Specify a browser to override this behavior, or set it to `none` to disable it completely. +BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. Specify a [browser](https://github.com/sindresorhus/opn#app) to override this behavior, or set it to `none` to disable it completely. HOST | :white_check_mark: | :x: | By default, the development web server binds to `localhost`. You may use this variable to specify a different host. PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. From 4faceb69d92f9549e30b1824ce25501187b85f73 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 15:33:06 -0500 Subject: [PATCH 10/12] Add .env link --- packages/react-scripts/template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 30cad453a1..dec9dad823 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1292,7 +1292,7 @@ Note that in order to support routers that use HTML5 `pushState` API, you may wa ## Advanced Configuration -You can adjust various development and production settings via environment variables. +You can adjust various development and production settings by setting environment variables in your shell or with [.env](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-development-environment-variables-in-env). Variable | Development | Production | Usage :--- | :---: | :---: | :--- From 470120965515e524062dff5477a38d9aa07bd4fd Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 15:38:12 -0500 Subject: [PATCH 11/12] Simpler links --- packages/react-scripts/template/README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index dec9dad823..8f563a6601 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1292,7 +1292,7 @@ Note that in order to support routers that use HTML5 `pushState` API, you may wa ## Advanced Configuration -You can adjust various development and production settings by setting environment variables in your shell or with [.env](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-development-environment-variables-in-env). +You can adjust various development and production settings by setting environment variables in your shell or with [.env](#adding-development-environment-variables-in-env). Variable | Development | Production | Usage :--- | :---: | :---: | :--- @@ -1300,7 +1300,7 @@ BROWSER | :white_check_mark: | :x: | By default, Create React App will open the HOST | :white_check_mark: | :x: | By default, the development web server binds to `localhost`. You may use this variable to specify a different host. PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. -PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application. +PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application. CI | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. ## Troubleshooting From 595095f548c50dbe4da2fa983abab57da71749de Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Fri, 10 Feb 2017 15:39:22 -0500 Subject: [PATCH 12/12] Add a CI flag note --- packages/react-scripts/template/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 8f563a6601..8315f3074b 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -1301,7 +1301,7 @@ HOST | :white_check_mark: | :x: | By default, the development web server binds t PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port. HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application. -CI | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. +CI | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. Most CIs set this flag by default. ## Troubleshooting