How do I add a .env file in gitlab ci during deployment stage?

Question

So I have a react/typescript app in my repo that I'm working on and in my repo I have a .env file that I'm ignoring so that my secrets don't get exposed and a .env-example file of important environment variables to configure. My problem is, since I'm not pushing the .env file to my repo, when I deploy my app through the google app engine(this is done in the deployment stage in my gitlab-ci.yml file), these environment variables will not be present in production and I need them for my app to work as I do something like this in my webpack.config.js file.

const dotenv = require('dotenv').config({ path: __dirname + '/.env' }); 

and then

new webpack.DefinePlugin({   'process.env': dotenv.parsed }) 

Here is my .gitlab-ci file for reference in case anyone here wants to see.

cache:   paths:     - node_modules/  stages:   - build   - test   - deploy  Build_Site:   image: node:8-alpine   stage: build   script:     - npm install --progress=false     - npm run-script build   artifacts:     expire_in: 1 week     paths:       - build  Run_Tests:   image: node:8-alpine   stage: test   script:     - npm install --progress=false     - npm run-script test  Deploy_Production:   image: google/cloud-sdk:latest   stage: deploy   environment: Production   only:     - master   script:     - echo $DEPLOY_KEY_FILE_PRODUCTION > /tmp/$CI_PIPELINE_ID.json     - gcloud auth activate-service-account --key-file /tmp/$CI_PIPELINE_ID.json     - gcloud config set project $PROJECT_ID_PRODUCTION     - gcloud info     - gcloud --quiet app deploy   after_script:     - rm /tmp/$CI_PIPELINE_ID.json 

Also, feel free to critique my gitlab-ci.yml file so I can make it better.

Answer 1

I don't know if you still need this, but this is how I achieved, what you wanted to.

1. Create your environment variables in your gitlab repo config

2. Create setup_env.sh:

#!/bin/bash  echo API_URL=$API_URL >> .env echo NODE_ENV=$NODE_ENV >> .env 

3. Modify your .gitlab-ci.yml. Upsert below to your before_script: section

  - chmod +x ./setup_env.sh   - ./setup_env.sh 

4. In webpack.config.js make use of https://www.npmjs.com/package/dotenv

require('dotenv').config(); 

This passes your .env variables available in webpack.config.js file.

Add this to your plugins array (add those variables you need):

    new webpack.DefinePlugin({       'process.env.API_URL': JSON.stringify(process.env.API_URL),       'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),       ...     }) 

Now your deployment should use your environment variables specified in you gitlab settings.