Fix dotenv file loading order (#9037)

* Fix dotenv file loading order

* tests: fix failing env tests

* tests: fix more failing tests

Co-authored-by: Brody McKee <mrmckeb@hotmail.com>

Author: Timer

docusaurus/docs/adding-custom-environment-variables.md

@@ -132,8 +132,8 @@ REACT_APP_NOT_SECRET_CODE=abcdef
 
 Files on the left have more priority than files on the right:
 
-- `npm start`: `.env.development.local`, `.env.development`, `.env.local`, `.env`
-- `npm run build`: `.env.production.local`, `.env.production`, `.env.local`, `.env`
+- `npm start`: `.env.development.local`, `.env.local`, `.env.development`, `.env`
+- `npm run build`: `.env.production.local`, `.env.local`, `.env.production`, `.env`
 - `npm test`: `.env.test.local`, `.env.test`, `.env` (note `.env.local` is missing)
 
 These variables will act as the defaults if the machine does not explicitly set them.

packages/react-scripts/config/env.js

@@ -25,11 +25,11 @@ if (!NODE_ENV) {
 // https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
 const dotenvFiles = [
   `${paths.dotenv}.${NODE_ENV}.local`,
-  `${paths.dotenv}.${NODE_ENV}`,
   // Don't include `.env.local` for `test` environment
   // since normally you expect tests to produce the same
   // results for everyone
   NODE_ENV !== 'test' && `${paths.dotenv}.local`,
+  `${paths.dotenv}.${NODE_ENV}`,
   paths.dotenv,
 ].filter(Boolean);
 

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

@@ -31,14 +31,14 @@ describe('Integration', () => {
           'production'
         );
         expect(doc.getElementById('feature-file-env-x').textContent).toBe(
-          'x-from-production-env'
+          'x-from-original-local-env'
         );
       } else {
         expect(doc.getElementById('feature-file-env').textContent).toBe(
           'development'
         );
         expect(doc.getElementById('feature-file-env-x').textContent).toBe(
-          'x-from-development-env'
+          'x-from-original-local-env'
         );
       }
     });