Improved build and deployment configuration

.do/app.yaml

@@ -13,7 +13,7 @@ ingress:
       name: lineup
     match:
       path:
-        prefix: /lineup
+        prefix: /
 name: lineup-app
 region: nyc
 static_sites:
@@ -23,6 +23,9 @@ static_sites:
   - key: NITRO_PRESET
     scope: BUILD_TIME
     value: digital-ocean
+  - key: NUXT_APP_BASE_URL
+    scope: BUILD_TIME
+    value: '/'
   error_document: 404.html
   github:
     branch: main

.github/workflows/nuxtjs.yml

@@ -63,10 +63,11 @@ jobs:
       - name: Static HTML export with Nuxt
         run: |
           ${{ steps.detect-package-manager.outputs.manager }} run generate
-          # this should be taken care of by Nitro with NITRO_PRESET
+          # this should be taken care of by Nitro with NITRO_PRESET=github_pages
           #touch ./.output/.nojekyll
         env:
           NITRO_PRESET: github_pages
+          NUXT_APP_BASE_URL: '/lineup/'
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v2
         with:

README.md

@@ -73,8 +73,6 @@ For a preview of the generated site on http://localhost:3000/, you can run:
 npm run preview
 ```
 
-Note that the preview feature may not work. A workaround is documented [here](https://github.com/nuxt/nuxt/issues/14454#issuecomment-1397357957) but it doesn't seem to help.
-
 ### Publish Firestore Indexes and Security Rules
 
 If the Firestore indexes or security rules have changed, they will need to be pushed during deployment of the app.

components/scoreboard/ScoreboardEmojiButton.vue

@@ -15,7 +15,7 @@ const emojiTitle = computed(() => emojiTitles[props.id]);
 <template>
     <button type="button" @click="emit('emote', props.id)" class="mb-2">
         <img
-            :src="`/lineup/images/fluentui-emoji/${props.id}_color.svg`"
+            :src="`/images/fluentui-emoji/${props.id}_color.svg`"
             :alt="emojiTitle"
             :title="emojiTitle"
         />

nuxt.config.ts

@@ -1,7 +1,6 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
-  // some people report having issues with devtools;
-  // uncomment to enable
+  // some people report having issues with devtools
   //devtools: { enabled: true },
   modules: [
     "@nuxtjs/color-mode",
@@ -10,19 +9,16 @@ export default defineNuxtConfig({
     "@vueuse/nuxt",
     "nuxt-vuefire"
   ],
-  // this allows us to deploy to free static hosting services
-  ssr: false,
-  // disable splash screen
-  spaLoadingTemplate: false,
   css: [
     'primevue/resources/themes/saga-blue/theme.css',
     'primevue/resources/primevue.css',
     'primeicons/primeicons.css',
     '~/assets/css/common.css',
   ],
   app: {
-    // required for GitHub deployment
-    baseURL: '/lineup/',
+    // overriden by NUXT_APP_BASE_URL envvar
+    // see https://nuxt.com/docs/api/composables/use-runtime-config#appbaseurl
+    //baseURL: '/',
     head: {
       htmlAttrs: {
         lang: 'en'
@@ -32,7 +28,7 @@ export default defineNuxtConfig({
         {
           rel: 'icon',
           type: 'image/x-icon',
-          href: '/lineup/favicon/favicon.ico'
+          href: '/favicon/favicon.ico'
         }
       ]
     }