nuxt-bridge ft nitro

.gitignore

@@ -9,6 +9,8 @@
 /metadata/
 /client/.nuxt/
 /client/dist/
+/client/dist
+/client/.output/
 /dist/
 /deploy/
 /coverage/

client/components/app/ConfigSideNav.vue

@@ -15,11 +15,11 @@
 
     <div class="w-44 h-12 px-4 border-t bg-bg border-black border-opacity-20 fixed left-0 flex flex-col justify-center" :class="wrapperClass" :style="{ bottom: streamLibraryItem ? '160px' : '0px' }">
       <div class="flex items-center justify-between">
-        <button type="button" class="underline font-mono text-sm" @click="clickChangelog">v{{ $config.version }}</button>
+        <button type="button" class="underline font-mono text-sm" @click="clickChangelog">v{{ $config.public.version }}</button>
 
         <p class="text-xs text-gray-300 italic">{{ Source }}</p>
       </div>
-      <a v-if="hasUpdate" :href="githubTagUrl" target="_blank" class="text-warning text-xs">Latest: {{ $config.version }}</a>
+      <a v-if="hasUpdate" :href="githubTagUrl" target="_blank" class="text-warning text-xs">Latest: {{ $config.public.version }}</a>
     </div>
   </div>
 </template>

client/components/app/SideRail.vue

@@ -116,7 +116,7 @@
     </div>
 
     <div class="w-full h-12 px-1 py-2 border-t border-black/20 bg-bg absolute left-0" :style="{ bottom: streamLibraryItem ? '224px' : '65px' }">
-      <p class="underline font-mono text-xs text-center text-gray-300 leading-3 mb-1" @click="clickChangelog">v{{ $config.version }}</p>
+      <p class="underline font-mono text-xs text-center text-gray-300 leading-3 mb-1" @click="clickChangelog">v{{ $config.public.version }}</p>
       <a v-if="hasUpdate" :href="githubTagUrl" target="_blank" class="text-warning text-xxs text-center block leading-3">Update</a>
       <p v-else class="text-xxs text-gray-400 leading-3 text-center italic">{{ Source }}</p>
     </div>

client/components/covers/AuthorImage.vue

@@ -55,8 +55,7 @@ export default {
       return this._author.updatedAt
     },
     imgSrc() {
-      if (!this.imagePath) return null
-      return `${this.$config.routerBasePath}/api/authors/${this.authorId}/image?token=${this.userToken}&ts=${this.updatedAt}`
+      return this.imagePath ? `${this.$config.public.routerBasePath}/api/authors/${this.authorId}/image?token=${this.userToken}&ts=${this.updatedAt}` : null
     }
   },
   methods: {

client/components/modals/ShareModal.vue

@@ -112,11 +112,10 @@ export default {
       return this.$store.state.user.user
     },
     demoShareUrl() {
-      return `${window.origin}${this.$config.routerBasePath}/share/${this.newShareSlug}`
+      return `${window.origin}${this.$config.public.routerBasePath}/share/${this.newShareSlug}`
     },
     currentShareUrl() {
-      if (!this.currentShare) return ''
-      return `${window.origin}${this.$config.routerBasePath}/share/${this.currentShare.slug}`
+      return this.currentShare ? `${window.origin}${this.$config.public.routerBasePath}/share/${this.currentShare.slug}` : ''
     },
     currentShareTimeRemaining() {
       if (!this.currentShare) return 'Error'

client/components/modals/player/QueueItemRow.vue

@@ -55,7 +55,7 @@ export default {
       return this.item.coverPath
     },
     coverUrl() {
-      if (!this.coverPath) return `${this.$config.routerBasePath}/book_placeholder.jpg`
+      if (!this.coverPath) return `${this.$config.public.routerBasePath}/book_placeholder.jpg`
       return this.$store.getters['globals/getLibraryItemCoverSrcById'](this.libraryItemId)
     },
     bookCoverAspectRatio() {
@@ -99,4 +99,4 @@ export default {
 .queue-item-row-content {
   max-width: calc(100% - 48px - 128px);
 }
-</style>
+</style>

client/components/readers/EpubReader.vue

@@ -15,7 +15,7 @@
 </template>
 
 <script>
-import ePub from 'epubjs'
+import ePub from '../../static/libs/epubjs-patch/index.js'
 
 /**
  * @typedef {object} EpubReader

client/layouts/default.vue

@@ -358,7 +358,7 @@ export default {
         transports: ['websocket'],
         upgrade: false,
         reconnection: true,
-        path: `${this.$config.routerBasePath}/socket.io`
+        path: `${this.$config.public.routerBasePath}/socket.io`
       })
       this.$root.socket = this.socket
       console.log('Socket initialized')

client/nuxt.config.js

@@ -1,9 +1,10 @@
-const pkg = require('./package.json')
+import { defineNuxtConfig } from '@nuxt/bridge'
+import pkg from './package.json'
 
 const routerBasePath = process.env.ROUTER_BASE_PATH || ''
 const serverHostUrl = process.env.NODE_ENV === 'production' ? '' : 'http://localhost:3333'
 
-module.exports = {
+export default defineNuxtConfig({
   // Disable server-side rendering: https://go.nuxtjs.dev/ssr-mode
   ssr: false,
   target: 'static',
@@ -14,9 +15,11 @@ module.exports = {
   },
   telemetry: false,
 
-  publicRuntimeConfig: {
-    version: pkg.version,
-    routerBasePath
+  runtimeConfig: {
+    public: {
+      version: pkg.version,
+      routerBasePath
+    }
   },
 
   // Global page headers: https://go.nuxtjs.dev/config-head
@@ -123,7 +126,8 @@ module.exports = {
           autoprefixer: {}
         }
       }
-    }
+    },
+    transpile: ['luxon', 'cookie-es']
   },
   watchers: {
     webpack: {
@@ -136,6 +140,11 @@ module.exports = {
     host: '0.0.0.0'
   },
 
+  bridge: {
+    transpile: true,
+    nitro: true
+  },
+
   /**
    * Temporary workaround for @nuxt-community/tailwindcss-module.
    *
@@ -145,4 +154,4 @@ module.exports = {
   devServerHandlers: [],
 
   ignore: ['**/*.test.*', '**/*.cy.*']
-}
+})