modify github actions

.github/workflows/docker-build-push.yml

@@ -13,15 +13,17 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        tag_name: [test1, test2]
+        path_name: ["", "/sps-gui", "/proctoring-gui"],
+        tag_suffix: ["", "single-host", "single-host2"],
+
     steps:
     - name: Set env for dynamic tag
       if: github.event_name == 'push' && startsWith(github.ref, 'refs/tags/')      
-      run: echo "TAG_NAME=${GITHUB_REF#refs/*/}" >> $GITHUB_ENV
+      run: echo "TAG_NAME=${GITHUB_REF#refs/*/}-${{ matrix.tag_suffix }}" >> $GITHUB_ENV
 
     - name: Set env manual
       if: github.event_name == 'workflow_dispatch'
-      run: echo "TAG_NAME=${{ matrix.tag_name }}" >> $GITHUB_ENV
+      run: echo "TAG_NAME=default_version-${{ matrix.tag_suffix }}" >> $GITHUB_ENV
 
     - name: Checkout code
       uses: actions/[email protected]
@@ -30,11 +32,13 @@ jobs:
       uses: docker/[email protected]
       with:
           username: naritter
-          password: ${{ secrets.DOCKERHUB_PASSWORD }}
+          password: ${{ secrets.DOCKERHUB_PASSWORD}}
 
     - name: Build and push Docker image
       uses: docker/[email protected]
       with:
         context: .
         push: true
         tags: docker.io/naritter/seb-sps-gui:${{ env.TAG_NAME }}
+      build-args: 
+          VITE_SUB_PATH: ${{ matrix.path_name }}

Dockerfile

@@ -4,6 +4,11 @@ WORKDIR /app/client
 COPY client/package*.json ./
 RUN npm install
 COPY client/ .
+
+# Inject environment variables for Vue.js
+ARG VUE_APP_MY_ENV_VAR
+RUN echo "VITE_SUB_PATH=$VITE_SUB_PATH" > .env
+
 RUN npm run build
 
 # Stage 2: Build the Express server

client/index.html

@@ -5,7 +5,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" href="/img/seb-logo-no-border.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <script src="/env.js"></script>
+    <script src="<%= process.env.VITE_SUB_PATH %>/env.js"></script>
     <title>SEB Screen Proctoring</title>
 </head>
 

client/src/router/router.ts

@@ -125,7 +125,7 @@ const routes: Array<RouteRecordRaw> = [
 ];
 
 const router = createRouter({
-  history: createWebHistory(),
+  history: createWebHistory(process.env.VITE_SUB_PATH),
   routes
 });
 

client/vite.config.mts

@@ -6,44 +6,52 @@ import { gitTagPlugin } from "./src/plugins/vite-plugin-git-tag";
 
 
 // Utilities
-import { defineConfig } from "vite"
+import { defineConfig, loadEnv } from "vite"
 import { fileURLToPath, URL } from "node:url"
 
 
 // https://vitejs.dev/config/
-export default defineConfig({
-  plugins: [
-    vue({ 
-      template: { transformAssetUrls }
-    }),
-    // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
-    vuetify({
-      autoImport: true,
-    }),
-    VueI18nPlugin({
-      include: fileURLToPath(new URL("./src/i18n/locales/**", import.meta.url)),
-    }),
-    // gitTagPlugin()
-  ],
-  define: { 
-    "process.env": {},
-    _global: ({}) 
-  },
-  resolve: {
-    alias: {
-      "@": fileURLToPath(new URL("./src", import.meta.url))
-    },
-    extensions: [
-      ".js",
-      ".json",
-      ".jsx",
-      ".mjs",
-      ".ts",
-      ".tsx",
-      ".vue",
-    ],
-  },
-  server: {
-    port: 8081,
-  },
-})
+// export default defineConfig({
+export default ({ mode }) => {
+    process.env = {...process.env, ...loadEnv(mode, process.cwd())};
+
+    return defineConfig({
+        plugins: [
+            vue({ 
+            template: { transformAssetUrls }
+            }),
+            // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
+            vuetify({
+            autoImport: true,
+            }),
+            VueI18nPlugin({
+            include: fileURLToPath(new URL("./src/i18n/locales/**", import.meta.url)),
+            }),
+            // gitTagPlugin()
+        ],
+        define: { 
+            "process.env": {},
+            _global: ({}) 
+        },
+        resolve: {
+            alias: {
+            "@": fileURLToPath(new URL("./src", import.meta.url))
+            },
+            extensions: [
+            ".js",
+            ".json",
+            ".jsx",
+            ".mjs",
+            ".ts",
+            ".tsx",
+            ".vue",
+            ],
+        },
+        server: {
+            port: 8081,
+        },
+
+        base: process.env.VITE_SUB_PATH
+
+    });
+}