fix #2223 - [feature] Implement dotenv-expand to accept variable expa…

Created by: moos

…nsion in dot env files

packages/react-scripts/config/env.js

@@ -35,13 +35,16 @@ var dotenvFiles = [
 
 // Load environment variables from .env* files. Suppress warnings using silent
 // if this file is missing. dotenv will never modify any environment variables
-// that have already been set.
+// that have already been set.  Variable expansion is supported in .env files.
 // https://github.com/motdotla/dotenv
+// https://github.com/motdotla/dotenv-expand
 dotenvFiles.forEach(dotenvFile => {
   if (fs.existsSync(dotenvFile)) {
-    require('dotenv').config({
-      path: dotenvFile,
-    });
+    require('dotenv-expand')(
+      require('dotenv').config({
+        path: dotenvFile,
+      })
+    );
   }
 });
 

packages/react-scripts/fixtures/kitchensink/integration/env.test.js

@@ -67,5 +67,22 @@ describe('Integration', () => {
         doc.getElementById('feature-shell-env-variables').textContent
       ).to.equal('fromtheshell.');
     });
+
+    it('expand .env variables', async () => {
+      const doc = await initDOM('expand-env-variables');
+
+      expect(doc.getElementById('feature-expand-env-1').textContent).to.equal(
+        'basic'
+      );
+      expect(doc.getElementById('feature-expand-env-2').textContent).to.equal(
+        'basic'
+      );
+      expect(doc.getElementById('feature-expand-env-3').textContent).to.equal(
+        'basic'
+      );
+      expect(
+        doc.getElementById('feature-expand-env-existing').textContent
+      ).to.equal('fromtheshell');
+    });
   });
 });

packages/react-scripts/fixtures/kitchensink/src/features/env/ExpandEnvVariables.js

+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+
+export default () => (
+  <span>
+    <span id="feature-expand-env-1">{process.env.REACT_APP_BASIC}</span>
+    <span id="feature-expand-env-2">{process.env.REACT_APP_BASIC_EXPAND}</span>
+    <span id="feature-expand-env-3">
+      {process.env.REACT_APP_BASIC_EXPAND_SIMPLE}
+    </span>
+    <span id="feature-expand-env-existing">
+      {process.env.REACT_APP_EXPAND_EXISTING}
+    </span>
+  </span>
+);

packages/react-scripts/fixtures/kitchensink/src/features/env/ExpandEnvVariables.test.js

+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+import ReactDOM from 'react-dom';
+import ExpandEnvVariables from './ExpandEnvVariables';
+
+describe('expand .env variables', () => {
+  it('renders without crashing', () => {
+    const div = document.createElement('div');
+    ReactDOM.render(<ExpandEnvVariables />, div);
+  });
+});

packages/react-scripts/fixtures/kitchensink/src/App.js

@@ -179,6 +179,11 @@ class App extends Component {
           this.setFeature(f.default)
         );
         break;
+      case 'expand-env-variables':
+        import('./features/env/ExpandEnvVariables').then(f =>
+          this.setFeature(f.default)
+        );
+        break;
       default:
         throw new Error(`Missing feature "${feature}"`);
     }