fix: working runtime env variables with docker

Dockerfile

@@ -43,6 +43,7 @@ COPY . .
 
 ARG VUE_APP_SOLO_URL
 ENV VUE_APP_SOLO_URL=$VUE_APP_SOLO_URL
+ENV VUE_APP_IS_DOCKER=True
 
 ENV NODE_ENV=production
 
@@ -57,5 +58,12 @@ COPY --from=build /usr/src/app/dist /usr/share/nginx/html
 # COPY --from=build /usr/src/app/nginx.prod.conf /etc/nginx/conf.d/default.conf
 EXPOSE 80
 
-CMD ["nginx", "-g", "daemon off;"]
+# Copy entrypoint script as /entrypoint.sh
+COPY ./entrypoint.sh /entrypoint.sh
+
+# Grant Linux permissions and run entrypoint script
+RUN chmod +x /entrypoint.sh
+ENTRYPOINT ["/entrypoint.sh"]
+
+# CMD ["nginx", "-g", "daemon off;"]
 

README.md

@@ -63,28 +63,35 @@ VUE_APP_SOLO_URL=http://localhost:8080
 
 ### With docker 
 
-Vue does not support runtime env variables, for this reason we need to provide them at build time
+We can provide runtime env variables using -e 
 
+#### Using image from registry 
+
+```
+docker run ghcr.io/vechain/insight-app:master -e VUE_APP_SOLO_URL=http://localhost:8080
+```
+
+#### Build local image 
 ```
-docker build -t insight-app --build-arg="VUE_APP_SOLO_URL=http://localhost:8080"
+docker build -t insight-app 
+docker run -e VUE_APP_SOLO_URL=http://localhost:8080
 ```
 
 ### With compose 
 
-Pass the build args in the compose file directly. 
+Use the image and pass the env variable in the compose file directly
 
 ```
+version: "3.7"
 services:
   insight:
-    build:
-      context: .
-      args:
-        - VUE_APP_SOLO_URL=http://localhost:8669
+    image: ghcr.io/vechain/insight-app:master
+    hostname: insight
+    container_name: insight
     environment:
-      NODE_ENV: production
-    
+      - VUE_APP_SOLO_URL=http://localhost:8669
     ports:
-      - 8080:80
+      - "8080:80"
 ```
 
 

entrypoint.sh

@@ -0,0 +1,14 @@
+#!/bin/sh
+
+ROOT_DIR=/usr/share/nginx/html
+
+echo "Replacing env constants in JS"
+for file in $ROOT_DIR/js/app.*.js* $ROOT_DIR/index.html $ROOT_DIR/precache-manifest*.js;
+do
+  echo "Processing $file ...";
+
+  sed -i 's|'VUE_APP_SOLO_URL_PLACEHOLDER'|'${VUE_APP_SOLO_URL}'|g' $file
+
+done
+
+nginx -g 'daemon off;'

src/create-connex.ts

@@ -1,13 +1,20 @@
 import Connex from "@vechain/connex/esm";
 
-export const soloUrlNode = process.env.VUE_APP_SOLO_URL;
 
+export const soloUrlNode = () => {
+    //Used to support docker runtime env variables. This string is overrided on container startup using the injected env 
+    if(process.env.VUE_APP_IS_DOCKER) {
+        const soloUrlPlaceholder = 'VUE_APP_SOLO_URL_PLACEHOLDER';
+        return soloUrlPlaceholder;
+    }
+    return process.env.VUE_APP_SOLO_URL;
+}
 //Needed to support runtime env variables
-export const isSoloNode = !!soloUrlNode;
+export const isSoloNode = !!soloUrlNode();
 export const nodeUrls = {
   main: "https://explore-mainnet.veblocks.net",
   test: "https://explore-testnet.veblocks.net",
-  solo: soloUrlNode ?? "http://localhost:8669",
+  solo: soloUrlNode() ?? "http://localhost:8669",
   custom: "",
 };