How can I run a env variables on bitbucket pipeline? - reactjs

Question

I've learned about pipelines with bitbucket and I want to make a new one to upload my react application (bootstrapped with create-react-app) and uploaded to an Amazon S3 bucket.
I made a bitbucket-pipelines.yml file like this one
image: node:10.15.3
pipelines:
default:
- step:
name: Installing dependencies
caches:
- node
script: # Modify the commands below to build your repository.
- rm -rf package-lock.json
- rm -f node_modules
- yarn add
- step:
name: Build
script:
- yarn build
When Bitbucket runs it, it shows me the next error message
env-cmd -f .env.production.local react-scripts build
Error: Unable to locate env file at location (.env.production.local)
This is it because in my package.json I use env-cmd to read my environment variables for the building script.
"scripts": {
"start": "env-cmd -f .env.development.local react-scripts start",
"build": "env-cmd -f .env.production.local react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
But I don't know how to read that environment variables (localized inside of my .env files) in my bitbucket-pipelines.yml file
How can I get that?

Answer 1

Better late than never...
.env, .env.production.local, or whatever file name you want. Interchangable.
first encode you .env file:
base64 -w 0 .env > envout.txt
Then add the contents of envout.txt to a repository variable in bitbucket $ENV_ENCODED or similar
Add decode command to your pipeline:
echo $ENV_ENCODED | base64 -d > .env
Extra info:
this needs to be done as one step, so include it just before your build
if the command is not found, use build image with base64
Other option is to include .env in docker image that you host on a secure service like AWS ECR and pull the image from there, and it will have your .env file
If someone is able to download build agent as artifact, they will be able to view the contents of your .env. This is more of a deterrent than the most secure option.
adding - cat .env as a step would validate the process, but maybe use fake .env
I would also recommend doing your installation and build in the same step. I've ran into issues where generated files (especially .env) are different between steps.
image: node:10.15.3
pipelines:
default:
- step:
name: Installing dependencies and Build
caches:
- node
script: # Modify the commands below to build your repository.
- rm -rf package-lock.json
- rm -f node_modules
- yarn add
- echo $ENV_ENCODED | base64 -d > .env
- yarn build