How to make a single React Docker build/image to run through all environments?

Question

i'm trying to deploy a React application in a single Docker container able to run through dev, preprod and prod on an OpenShift platform on which i can only push tagged docker images. In order to do this i have:

• a React application generated with create-react-app hosted on Github
• a Dockerfile at project root containing the docker build/run process
• a .gitlab-ci.yml file containing the continuous integration checks and deploy methods
• an accessible OpenShift platform

What i can do:

I can easily generate a production build '/build' that will be added in the docker image build phase and will run with a production context or i can build at run start (but just writing it feels bad).

The problem:

This generated image isn't able to run through all environment, and i don't want to have a specific build for each environment.

What i want:

I want to be able to generate a single docker image that will run through all environments without having to install dependencies or build when only RUN is needed.

here is my Dockerfile:

FROM nginx:1.15.5-alpine
RUN addgroup --system app \
    && adduser --uid 1001 --system --ingroup app app \
    && rm -rf /etc/nginx/conf.d/default.conf \
    && apk add --update nodejs nodejs-npm \
    && mkdir /apptmp
COPY . /apptmp
RUN chmod 777 /apptmp
COPY config/default.conf /etc/nginx/conf.d/
COPY config/buildWithEnv.sh .

RUN touch /var/run/nginx.pid && \
  chown -R app:app /var/run/nginx.pid && \
  chown -R app:app /var/cache/nginx && \
  chown -R app:app /usr/share/nginx/html
EXPOSE 8080
USER 1001
CMD sh buildWithEnv.sh

And here is the script buildWithEnv.sh

#!/bin/bash

echo "===> Changin directory: /apptmp ..."
cd /apptmp

echo "===> Installing dependencies: npm install ..."
npm install

echo "===> Building application: npm run build ..."
npm run build

echo "===> Copying to exposed html folder ... "
rm -rf /usr/share/nginx/html/*
cp -r build/* /usr/share/nginx/html/

echo "===> Launching http server ... "
nginx -g 'daemon off;'

Answer 1

A possible approach is described on this blog-post

Basically: You use placeholders for all environment specific parts in your static resources. Then you configure nginx' sub_filter to replace those at runtime with the environment specific values.