archy/neode-ui/vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { VitePWA } from 'vite-plugin-pwa'
import path from 'path'

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    VitePWA({
      registerType: 'autoUpdate',
      includeAssets: ['favico.png', 'favico.svg', 'favicon.ico'],
      manifest: {
        name: 'Archipelago',
        short_name: 'Archipelago',
        description: 'Your sovereign personal server',
        theme_color: '#000000',
        background_color: '#000000',
        display: 'standalone',
        orientation: 'any',
        scope: '/',
        start_url: '/',
        categories: ['productivity', 'utilities'],
        prefer_related_applications: false,
        icons: [
          {
            src: '/assets/img/favico.png',
            sizes: '72x72',
            type: 'image/png',
            purpose: 'any'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '96x96',
            type: 'image/png',
            purpose: 'any'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '128x128',
            type: 'image/png',
            purpose: 'any'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '144x144',
            type: 'image/png',
            purpose: 'any'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '152x152',
            type: 'image/png',
            purpose: 'any'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '192x192',
            type: 'image/png',
            purpose: 'any'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '384x384',
            type: 'image/png',
            purpose: 'any'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '512x512',
            type: 'image/png',
            purpose: 'any'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '192x192',
            type: 'image/png',
            purpose: 'maskable'
          },
          {
            src: '/assets/img/favico.png',
            sizes: '512x512',
            type: 'image/png',
            purpose: 'maskable'
          }
        ],
        shortcuts: [
          {
            name: 'Dashboard',
            short_name: 'Dashboard',
            description: 'Open the dashboard',
            url: '/dashboard',
            icons: [{ src: '/assets/img/favico.png', sizes: '192x192' }]
          },
          {
            name: 'My Apps',
            short_name: 'Apps',
            description: 'Manage your apps',
            url: '/apps',
            icons: [{ src: '/assets/img/favico.png', sizes: '192x192' }]
          },
          {
            name: 'App Store',
            short_name: 'Store',
            description: 'Browse and install apps',
            url: '/marketplace',
            icons: [{ src: '/assets/img/favico.png', sizes: '192x192' }]
          }
        ]
      },
      workbox: {
        globPatterns: ['**/*.{js,css,html,ico,png,svg,jpg,jpeg,mp4,webp}'],
        globIgnores: [
          '**/*-backup-*.mp4',
          '**/*-1.47mb.mp4',
          '**/bg-*.mp4', // Exclude large background videos from precache
          '**/video-intro.mp4', // Exclude video-intro.mp4 from precache (7MB, cached at runtime)
          '**/favico.svg', // Exclude large SVG (5.73MB) - use PNG instead
          '**/icon/favico.svg' // Exclude duplicate large SVG
        ],
        maximumFileSizeToCacheInBytes: 5 * 1024 * 1024, // 5MB limit (increased from 2MB)
        skipWaiting: false, // Wait for user to accept update
        clientsClaim: false, // Don't claim clients immediately
        runtimeCaching: [
          {
            urlPattern: /^https:\/\/fonts\.googleapis\.com\/.*/i,
            handler: 'CacheFirst',
            options: {
              cacheName: 'google-fonts-cache',
              expiration: {
                maxEntries: 10,
                maxAgeSeconds: 60 * 60 * 24 * 365 // 1 year
              },
              cacheableResponse: {
                statuses: [0, 200]
              }
            }
          },
          {
            urlPattern: /^https:\/\/fonts\.gstatic\.com\/.*/i,
            handler: 'CacheFirst',
            options: {
              cacheName: 'gstatic-fonts-cache',
              expiration: {
                maxEntries: 10,
                maxAgeSeconds: 60 * 60 * 24 * 365 // 1 year
              },
              cacheableResponse: {
                statuses: [0, 200]
              }
            }
          },
          {
            urlPattern: /\/rpc\/v1\/.*/i,
            handler: 'NetworkFirst',
            options: {
              cacheName: 'api-cache',
              expiration: {
                maxEntries: 50,
                maxAgeSeconds: 60 * 5 // 5 minutes
              },
              networkTimeoutSeconds: 10
            }
          },
          {
            urlPattern: /\/assets\/.*/i,
            handler: 'CacheFirst',
            options: {
              cacheName: 'assets-cache',
              expiration: {
                maxEntries: 100,
                maxAgeSeconds: 60 * 60 * 24 * 30 // 30 days
              }
            }
          }
        ]
      },
      devOptions: {
        enabled: true,
        type: 'module'
      }
    })
  ],
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src')
    }
  },
  server: {
    port: 8100,
    proxy: {
      '/rpc/v1': {
        target: process.env.BACKEND_URL || 'http://localhost:5959',
        changeOrigin: true,
        secure: false,
      },
      '/ws': {
        target: process.env.BACKEND_URL || 'http://localhost:5959',
        ws: true,
        changeOrigin: true,
        secure: false,
        rewrite: (path) => path, // Don't rewrite the path
        timeout: 0, // No timeout for WebSocket connections
      },
      '/public': {
        target: process.env.BACKEND_URL || 'http://localhost:5959',
        changeOrigin: true,
        secure: false,
      },
      '/rest': {
        target: process.env.BACKEND_URL || 'http://localhost:5959',
        changeOrigin: true,
        secure: false,
      },
    },
  },
  build: {
    // Output to dist for Docker builds, or to ../web/dist/neode-ui for local development
    outDir: process.env.DOCKER_BUILD === 'true' ? 'dist' : '../web/dist/neode-ui',
    emptyOutDir: true,
  },
})