From 626d0372f5ade94e723551b6081ec43f16990016 Mon Sep 17 00:00:00 2001 From: Mars Hall Date: 2018年9月23日 11:04:18 -0700 Subject: [PATCH 1/7] Support dyno metadata during build --- .buildpacks | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.buildpacks b/.buildpacks index f8ce2aa9..ae4acfd3 100644 --- a/.buildpacks +++ b/.buildpacks @@ -1,3 +1,3 @@ https://github.com/heroku/heroku-buildpack-nodejs.git -https://github.com/mars/create-react-app-inner-buildpack.git#v5.1.0 +https://github.com/mars/create-react-app-inner-buildpack.git#v6.0.0 https://github.com/heroku/heroku-buildpack-static.git From 8778ec03f918db8559ad6bcaa4d1e3931ef6c502 Mon Sep 17 00:00:00 2001 From: Mars Hall Date: 2018年9月23日 11:17:22 -0700 Subject: [PATCH 2/7] =?UTF-8?q?=F0=9F=93=9A=20Support=20for=20dyno=20metad?= =?UTF-8?q?ata=20during=20build?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index 445d3298..919b55b4 100644 --- a/README.md +++ b/README.md @@ -313,7 +313,7 @@ Replace `http://localhost:8000` with the URL to your local or remote backend ser [`REACT_APP_*` environment variables](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables) are supported with this buildpack. -🤐 *Be careful not to export secrets. These values may be accessed by anyone who can see the React app.* +🚫🤐 ***Not for secrets.** These values may be accessed by anyone who can see the React app.* ### [Set vars on Heroku](https://devcenter.heroku.com/articles/config-vars) @@ -349,6 +349,8 @@ ex: `REACT_APP_FILEPICKER_API_KEY` ([Add-on config vars](#user-content-add-on-co ### Compile-time configuration +Supports `REACT_APP_`, `NODE_`, `NPM_`, & `HEROKU_` prefixed variables. + ♻️ The app must be re-deployed for compiled changes to take effect. ```bash @@ -360,7 +362,9 @@ git push heroku master ### Runtime configuration -*Requires at least create-react-app 0.7.* +Supports only `REACT_APP_` prefixed variables. + +🚫🤐 ***Not for secrets.** These values may be accessed by anyone who can see the React app.* Install the [runtime env npm package](https://www.npmjs.com/package/@mars/heroku-js-runtime-env): @@ -407,9 +411,9 @@ heroku config:unset JS_RUNTIME_TARGET_BUNDLE ### Add-on config vars -🤐 *Be careful not to export secrets. These values may be accessed by anyone who can see the React app.* +🚫🤐 ***Be careful not to export secrets.** These values may be accessed by anyone who can see the React app.* -Use a custom [`.profile.d` script](https://devcenter.heroku.com/articles/buildpack-api#profile-d-scripts) to make variables visible to the React app by prefixing them with `REACT_APP_`. +Use a custom [`.profile.d` script](https://devcenter.heroku.com/articles/buildpack-api#profile-d-scripts) to make variables set by other components available to the React app by prefixing them with `REACT_APP_`. 1. create `.profile.d/000-react-app-exports.sh` 1. make it executable `chmod +x .profile.d/000-react-app-exports.sh` @@ -476,10 +480,10 @@ This buildpack will never intentionally cause previously deployed apps to become [Releases are tagged](https://github.com/mars/create-react-app-buildpack/releases), so you can lock an app to a specific version, if that kind of determinism pleases you: ```bash -heroku buildpacks:set https://github.com/mars/create-react-app-buildpack.git#v5.1.0 +heroku buildpacks:set https://github.com/mars/create-react-app-buildpack.git#v6.0.0 ``` -✏️ *Replace `v5.1.0` with the desired [release tag](https://github.com/mars/create-react-app-buildpack/releases).* +✏️ *Replace `v6.0.0` with the desired [release tag](https://github.com/mars/create-react-app-buildpack/releases).* ♻️ Then, commit & deploy to rebuild on the new buildpack version. @@ -500,7 +504,7 @@ This buildpack combines several buildpacks, specified in [`.buildpacks`](.buildp 2. [`mars/create-react-app-inner-buildpack`](https://github.com/mars/create-react-app-inner-buildpack) * production build for create-react-app * executes the npm package's build script; create-react-app default is `react-scripts build` - * exposes `REACT_APP_`, `NODE_`, & `NPM_` prefixed env vars to the build script + * exposes `REACT_APP_`, `NODE_`, `NPM_`, & `HEROKU_` prefixed env vars to the build script * generates a production bundle regardless of `NODE_ENV` setting * sets default [web server config](#user-content-web-server) unless `static.json` already exists * enables [runtime environment variables](#user-content-environment-variables) From e4aa396c208565240d82960c1e61f84bea607446 Mon Sep 17 00:00:00 2001 From: Mars Hall Date: 2018年9月23日 11:41:00 -0700 Subject: [PATCH 3/7] =?UTF-8?q?=F0=9F=93=9A=20clarify=20compile-time=20env?= =?UTF-8?q?=20var=20usage?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 919b55b4..fa220f27 100644 --- a/README.md +++ b/README.md @@ -311,7 +311,7 @@ Replace `http://localhost:8000` with the URL to your local or remote backend ser ### Environment variables -[`REACT_APP_*` environment variables](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables) are supported with this buildpack. +[`REACT_APP_*` environment variables](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables) are fully supported with this buildpack. 🚫🤐 ***Not for secrets.** These values may be accessed by anyone who can see the React app.* @@ -349,7 +349,21 @@ ex: `REACT_APP_FILEPICKER_API_KEY` ([Add-on config vars](#user-content-add-on-co ### Compile-time configuration -Supports `REACT_APP_`, `NODE_`, `NPM_`, & `HEROKU_` prefixed variables. +Supports [`REACT_APP_`](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables), `NODE_`, `NPM_`, & `HEROKU_` prefixed variables. + +Use Node's [`process.env` object](https://nodejs.org/dist/latest-v10.x/docs/api/process.html#process_process_env). During the build, these references will be replaced with their quoted string value. + +```javascript +import React, { Component } from 'react'; + +class App extends Component { + render() { + return ( + Runtime env var example: { process.env.REACT_APP_HELLO } + ); + } +} +``` ♻️ The app must be re-deployed for compiled changes to take effect. @@ -362,7 +376,7 @@ git push heroku master ### Runtime configuration -Supports only `REACT_APP_` prefixed variables. +Supports only [`REACT_APP_`](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables) prefixed variables. 🚫🤐 ***Not for secrets.** These values may be accessed by anyone who can see the React app.* From fdefaae1a82fad7b177b605bf077454ece4c994f Mon Sep 17 00:00:00 2001 From: Mars Hall Date: 2018年9月23日 11:56:33 -0700 Subject: [PATCH 4/7] =?UTF-8?q?=F0=9F=90=9E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- bin/compile | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/bin/compile b/bin/compile index efa4c76b..8c810d01 100755 --- a/bin/compile +++ b/bin/compile @@ -23,6 +23,16 @@ CACHE_DIR=2ドル ENV_DIR=3ドル BP_DIR=`cd $(dirname 0ドル); cd ..; pwd` +topic "ENV_DIR" +ls -hal $ENV_DIR | indent + +topic "Environment variables" +if [ -d "$ENV_DIR" ]; then + for e in $(ls $ENV_DIR); do + echo " $e=$(cat $ENV_DIR/$e)" + done +fi + # Use architecture of multi-buildpack to compose behavior. # https://github.com/heroku/heroku-buildpack-multi cp $BP_DIR/.buildpacks $BUILD_DIR/.buildpacks From 64d974c3febc03c525f7d164c59f34306a25cdfa Mon Sep 17 00:00:00 2001 From: Mars Hall Date: 2018年9月23日 11:58:01 -0700 Subject: [PATCH 5/7] =?UTF-8?q?=F0=9F=90=9E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- bin/compile | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/bin/compile b/bin/compile index 8c810d01..deace4a1 100755 --- a/bin/compile +++ b/bin/compile @@ -23,13 +23,13 @@ CACHE_DIR=2ドル ENV_DIR=3ドル BP_DIR=`cd $(dirname 0ドル); cd ..; pwd` -topic "ENV_DIR" -ls -hal $ENV_DIR | indent +echo "ENV_DIR" +ls -hal $ENV_DIR -topic "Environment variables" +echo "Environment variables" if [ -d "$ENV_DIR" ]; then for e in $(ls $ENV_DIR); do - echo " $e=$(cat $ENV_DIR/$e)" + echo "$e=$(cat $ENV_DIR/$e)" done fi From 0b7b572351aa60b85f485d7d4f3a5112fec078f7 Mon Sep 17 00:00:00 2001 From: Mars Hall Date: 2018年9月23日 12:08:14 -0700 Subject: [PATCH 6/7] =?UTF-8?q?=F0=9F=93=9A=20clarify=20namespacing=20of?= =?UTF-8?q?=20env=20vars=20for=20React=20app?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index fa220f27..f016a1fe 100644 --- a/README.md +++ b/README.md @@ -351,7 +351,7 @@ ex: `REACT_APP_FILEPICKER_API_KEY` ([Add-on config vars](#user-content-add-on-co Supports [`REACT_APP_`](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables), `NODE_`, `NPM_`, & `HEROKU_` prefixed variables. -Use Node's [`process.env` object](https://nodejs.org/dist/latest-v10.x/docs/api/process.html#process_process_env). During the build, these references will be replaced with their quoted string value. +Use Node's [`process.env` object](https://nodejs.org/dist/latest-v10.x/docs/api/process.html#process_process_env). ```javascript import React, { Component } from 'react'; @@ -365,7 +365,7 @@ class App extends Component { } ``` -♻️ The app must be re-deployed for compiled changes to take effect. +♻️ The app must be re-deployed for compiled changes to take effect, because during the build, these references will be replaced with their quoted string value. ```bash heroku config:set REACT_APP_HELLO='I love sushi!' @@ -374,6 +374,12 @@ git commit --allow-empty -m "Set REACT_APP_HELLO config var" git push heroku master ``` +Only `REACT_APP_` vars are replaced in create-react-app's build. To make any other variables visible to React, they must be prefixed for the build command in `package.json`, like this: + +```bash +REACT_APP_HEROKU_SLUG_COMMIT=$HEROKU_SLUG_COMMIT react-scripts build +``` + ### Runtime configuration Supports only [`REACT_APP_`](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables) prefixed variables. From 4eddfb51f582ab89df998260bdd6c49d597f2b72 Mon Sep 17 00:00:00 2001 From: Mars Hall Date: 2018年9月23日 12:10:09 -0700 Subject: [PATCH 7/7] =?UTF-8?q?=F0=9F=9A=AB=F0=9F=90=9E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- bin/compile | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/bin/compile b/bin/compile index deace4a1..efa4c76b 100755 --- a/bin/compile +++ b/bin/compile @@ -23,16 +23,6 @@ CACHE_DIR=2ドル ENV_DIR=3ドル BP_DIR=`cd $(dirname 0ドル); cd ..; pwd` -echo "ENV_DIR" -ls -hal $ENV_DIR - -echo "Environment variables" -if [ -d "$ENV_DIR" ]; then - for e in $(ls $ENV_DIR); do - echo "$e=$(cat $ENV_DIR/$e)" - done -fi - # Use architecture of multi-buildpack to compose behavior. # https://github.com/heroku/heroku-buildpack-multi cp $BP_DIR/.buildpacks $BUILD_DIR/.buildpacks

AltStyle によって変換されたページ (->オリジナル) /