From 88d675cb0b515e32832f7c157fe6b53e3a61b974 Mon Sep 17 00:00:00 2001 From: Devin Cowan Date: Tue, 9 Jan 2024 11:19:05 -0500 Subject: [PATCH 1/4] conditional copy env file for frontend build --- app/frontend/Dockerfile | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app/frontend/Dockerfile b/app/frontend/Dockerfile index 26c3a62e..93004320 100644 --- a/app/frontend/Dockerfile +++ b/app/frontend/Dockerfile @@ -1,6 +1,7 @@ FROM node:20.9.0 as build-stage WORKDIR /app -COPY .env ../.env +COPY env.template .en[v] ../ +RUN [ ! -f ../env ] && cp ../env.template ../.env COPY ./frontend . RUN npm update RUN npm run build From 424bfb4986cecbcd85c34fb91ea4696ee4eeaf84 Mon Sep 17 00:00:00 2001 From: Devin Cowan Date: Tue, 9 Jan 2024 13:56:14 -0500 Subject: [PATCH 2/4] only "VITE" envs exported to image --- app/docker-compose.yml | 3 +++ app/frontend/Dockerfile | 13 +++++++++---- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/app/docker-compose.yml b/app/docker-compose.yml index 54ca2960..3f5023c1 100644 --- a/app/docker-compose.yml +++ b/app/docker-compose.yml @@ -18,8 +18,11 @@ services: frontend: image: frontend + env_file: + - .env build: dockerfile: ./frontend/Dockerfile + context: ./ ports: - 8080:5003 restart: unless-stopped diff --git a/app/frontend/Dockerfile b/app/frontend/Dockerfile index 93004320..82e7b293 100644 --- a/app/frontend/Dockerfile +++ b/app/frontend/Dockerfile @@ -1,14 +1,19 @@ +# in order to get the required .env, context must be app/ +# docker build -f app/frontend/Dockerfile app/ FROM node:20.9.0 as build-stage +WORKDIR /tmp +COPY *env* ./ +RUN [ -f ".env" ] || cp env.template .env +RUN grep '^VITE' .env > /.env + WORKDIR /app -COPY env.template .en[v] ../ -RUN [ ! -f ../env ] && cp ../env.template ../.env -COPY ./frontend . +ADD frontend . RUN npm update RUN npm run build FROM nginx:1.24.0 as production-stage RUN mkdir /app COPY --from=build-stage /app/dist /app -COPY --from=build-stage /.env .env +COPY --from=build-stage .env .env COPY --from=build-stage /app/nginx.conf /etc/nginx/nginx.conf EXPOSE 5003 \ No newline at end of file From 465ea6425b547b2237ad937788f96a0c397e5b31 Mon Sep 17 00:00:00 2001 From: Devin Cowan Date: Tue, 9 Jan 2024 20:54:54 -0500 Subject: [PATCH 3/4] runtime env substitution --- .github/workflows/frontend-gh-pages.yml | 1 - app/frontend/.dockerignore | 3 ++- app/frontend/Dockerfile | 5 +++++ app/frontend/docker-entrypoint.sh | 18 +++++++++++++----- app/frontend/src/constants.js | 7 +++---- 5 files changed, 23 insertions(+), 11 deletions(-) diff --git a/.github/workflows/frontend-gh-pages.yml b/.github/workflows/frontend-gh-pages.yml index 5e61a99f..2bd02e86 100644 --- a/.github/workflows/frontend-gh-pages.yml +++ b/.github/workflows/frontend-gh-pages.yml @@ -43,7 +43,6 @@ jobs: touch .env echo VITE_APP_API_URL=${{ secrets.VITE_APP_API_URL }} >> .env echo VITE_APP_FULL_URL=${{ secrets.VITE_APP_FULL_URL }} >> .env - echo VITE_OAUTH2_REDIRECT_URL=${{ secrets.VITE_OAUTH2_REDIRECT_URL }} >> .env echo VITE_APP_BASE=${{ secrets.VITE_APP_BASE }} >> .env cp .env ../.env - name: Install dependencies diff --git a/app/frontend/.dockerignore b/app/frontend/.dockerignore index b512c09d..76add878 100644 --- a/app/frontend/.dockerignore +++ b/app/frontend/.dockerignore @@ -1 +1,2 @@ -node_modules \ No newline at end of file +node_modules +dist \ No newline at end of file diff --git a/app/frontend/Dockerfile b/app/frontend/Dockerfile index 82e7b293..eb60551b 100644 --- a/app/frontend/Dockerfile +++ b/app/frontend/Dockerfile @@ -16,4 +16,9 @@ RUN mkdir /app COPY --from=build-stage /app/dist /app COPY --from=build-stage .env .env COPY --from=build-stage /app/nginx.conf /etc/nginx/nginx.conf + +# Allow substitution of env vars at runtime +COPY frontend/docker-entrypoint.sh / +RUN chmod +x /docker-entrypoint.sh +ENTRYPOINT ["/docker-entrypoint.sh"] EXPOSE 5003 \ No newline at end of file diff --git a/app/frontend/docker-entrypoint.sh b/app/frontend/docker-entrypoint.sh index b4bfc75d..1f50e151 100755 --- a/app/frontend/docker-entrypoint.sh +++ b/app/frontend/docker-entrypoint.sh @@ -1,6 +1,14 @@ -#!/bin/bash +#!/bin/sh +ROOT_DIR=/app +# Replace env vars in files served by NGINX +for file in $ROOT_DIR/assets/*.js $ROOT_DIR/index.html; +do + echo "Processing $file ..."; + # LC_ALL=C sed -i "" 's|VITE_APP_API_URL_PLACEHOLDER|'${VITE_APP_API_URL}'|g' $file + sed -i 's|VITE_APP_API_URL_PLACEHOLDER|'${VITE_APP_API_URL}'|g' $file + sed -i 's|VITE_APP_FULL_URL_PLACEHOLDER|'${VITE_APP_FULL_URL}'|g' $file + sed -i 's|VITE_APP_BASE_PLACEHOLDER|'${VITE_APP_BASE}'|g' $file +done -npm i @vue/cli-service -npm install -npm run build -npm run serve -- --port 5003 \ No newline at end of file +echo "Starting Nginx" +nginx -g 'daemon off;' \ No newline at end of file diff --git a/app/frontend/src/constants.js b/app/frontend/src/constants.js index c5bb16c6..4a2e77df 100644 --- a/app/frontend/src/constants.js +++ b/app/frontend/src/constants.js @@ -1,8 +1,7 @@ -export const APP_NAME = import.meta.env.VITE_APP_NAME || ""; -export const APP_URL = import.meta.env.VITE_APP_FULL_URL || ""; -export const APP_BASE = import.meta.env.VITE_APP_BASE || ""; +export const APP_URL = import.meta.env.VITE_APP_FULL_URL || "VITE_APP_FULL_URL_PLACEHOLDER"; +export const APP_BASE = import.meta.env.VITE_APP_BASE || "VITE_APP_BASE_PLACEHOLDER"; -export const API_BASE = import.meta.env.VITE_APP_API_URL || ""; +export const API_BASE = import.meta.env.VITE_APP_API_URL || "VITE_APP_API_URL_PLACEHOLDER"; export const ENDPOINTS = { openapi: `${API_BASE}/openapi.json`, authCuahsiAuthorize: `${API_BASE}/auth/front/authorize`, From 6b43e5a8d0bb878dc40648341533bdb61617df7b Mon Sep 17 00:00:00 2001 From: Devin Cowan Date: Tue, 9 Jan 2024 21:09:19 -0500 Subject: [PATCH 4/4] WIP test no env --- app/frontend/Dockerfile | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/app/frontend/Dockerfile b/app/frontend/Dockerfile index eb60551b..23a13003 100644 --- a/app/frontend/Dockerfile +++ b/app/frontend/Dockerfile @@ -2,9 +2,9 @@ # docker build -f app/frontend/Dockerfile app/ FROM node:20.9.0 as build-stage WORKDIR /tmp -COPY *env* ./ -RUN [ -f ".env" ] || cp env.template .env -RUN grep '^VITE' .env > /.env +# COPY *env* ./ +# RUN [ -f ".env" ] || cp env.template .env +# RUN grep '^VITE' .env > /.env WORKDIR /app ADD frontend . @@ -14,7 +14,7 @@ RUN npm run build FROM nginx:1.24.0 as production-stage RUN mkdir /app COPY --from=build-stage /app/dist /app -COPY --from=build-stage .env .env +# COPY --from=build-stage .env .env COPY --from=build-stage /app/nginx.conf /etc/nginx/nginx.conf # Allow substitution of env vars at runtime