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 c85e544720b..399db40b821 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 399db40b821..a1711e00089 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 a1711e00089..3eb08f2c61e 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 3eb08f2c61e..09f17565467 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 09f17565467..27e76fcbb96 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 85a23174d2b..52843b572ed 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 27e76fcbb96..6c19ebaed0e 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 6c19ebaed0e..a4f4d7d359b 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 a4f4d7d359b..30cad453a1a 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 30cad453a1a..dec9dad8232 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 dec9dad8232..8f563a66011 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 8f563a66011..8315f3074b0 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