Merge pull request #22 from yuru-baku/autodeploy

Autodeploy vue to pages
yuru-baku · Mar 1, 2024 · 26104aa · 26104aa
2 parents 4e14f4d + 91bbcab
commit 26104aa
Show file tree

Hide file tree

Showing 5 changed files with 66 additions and 71 deletions.
diff --git a/.github/workflows/deploy-vue_config.yml b/.github/workflows/deploy-vue_config.yml
@@ -0,0 +1,55 @@
+name: Build and Deploy Vue App
+
+on:
+  push:
+    branches:
+      - main
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    env:
+      working-directory: frontend-vue
+
+    steps:
+      - uses: actions/[email protected]
+
+      - name: Use Node.js 20
+        uses: actions/[email protected]
+        with:
+          node-version: 20
+
+      - name: Cache Dependencies
+        uses: actions/[email protected]
+        with:
+          path: ${{env.working-directory}}/node_modules
+          key: ${{ runner.os }}-build-${{ hashFiles('package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-build-
+
+      - name: Install dependencies (on cache miss)
+        working-directory: ${{env.working-directory}}
+        if: steps.cache-dependencies.outputs.cache-hit == false
+        run: npm ci
+
+      - name: Build the Vue app
+        working-directory: ${{env.working-directory}}
+        run: npm run build     
+
+      - name: Fix permissions
+        run: |
+          chmod -c -R +rX "${{env.working-directory}}/dist" | while read line; do
+          echo "::warning title=Invalid file permissions automatically fixed::$line"
+          done
+      
+      - name: Upload GitHub Pages artifact
+        uses: actions/[email protected]
+        with:
+          path: ${{env.working-directory}}/dist
+      - name: Deploy to GitHub Pages
+        uses: actions/[email protected]
diff --git a/.github/workflows/test-and-deploy.yml b/.github/workflows/test-and-deploy.yml
diff --git a/frontend-vue/package-lock.json b/frontend-vue/package-lock.json
diff --git a/frontend-vue/src/views/LobbyCreaterView.vue b/frontend-vue/src/views/LobbyCreaterView.vue
@@ -22,15 +22,21 @@ function copyToClipboard() {
                 :key="user.id"
                 :class="{ online: !user.disconnected, offline: user.disconnected }"
             >
-                <font-awesome-icon icon="circle" v-if="user.id !== conService.you.value?.id" />
-                <font-awesome-icon icon="play" v-if="user.id === conService.you.value?.id" />
+                <font-awesome-icon
+                    :icon="['fas', 'circle']"
+                    v-if="user.id !== conService.you.value?.id"
+                />
+                <font-awesome-icon
+                    :icon="['fas', 'play']"
+                    v-if="user.id === conService.you.value?.id"
+                />
                 {{ user.name }}
             </div>
             <div
                 class="playerStatus empty"
                 v-for="i in 4 - (conService.room.value?.users.length || 0)"
             >
-                <font-awesome-icon icon="circle" />
+                <font-awesome-icon :icon="['fas', 'circle']" />
                 empty
             </div>
             <button id="invite" @click="copyToClipboard()">Copy Invite</button>

diff --git a/frontend-vue/vite.config.ts b/frontend-vue/vite.config.ts
@@ -5,6 +5,7 @@ import vue from '@vitejs/plugin-vue'
 
 // https://vitejs.dev/config/
 export default defineConfig({
+  base: '/InfintyDeck',
   plugins: [
     vue({
       template: {