construprogress/vite.config.js

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import { VitePWA } from 'vite-plugin-pwa';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
        VitePWA({
            registerType: 'autoUpdate',
            includeAssets: ['favicon.ico', 'robots.txt'],
            manifest: {
                name: 'ConstruProgress',
                short_name: 'CP',
                description: 'Sistema de Gestión de Obras - ConstruProgress',
                theme_color: '#2563eb',
                background_color: '#ffffff',
                display: 'standalone',
                orientation: 'portrait-primary',
                scope: '/',
                start_url: '/',
                icons: [
                    {
                        src: '/icons/icon-72x72.svg',
                        sizes: '72x72',
                        type: 'image/svg+xml',
                        purpose: 'maskable any'
                    },
                    {
                        src: '/icons/icon-96x96.svg',
                        sizes: '96x96',
                        type: 'image/svg+xml',
                        purpose: 'maskable any'
                    },
                    {
                        src: '/icons/icon-128x128.svg',
                        sizes: '128x128',
                        type: 'image/svg+xml',
                        purpose: 'maskable any'
                    },
                    {
                        src: '/icons/icon-144x144.svg',
                        sizes: '144x144',
                        type: 'image/svg+xml',
                        purpose: 'maskable any'
                    },
                    {
                        src: '/icons/icon-152x152.svg',
                        sizes: '152x152',
                        type: 'image/svg+xml',
                        purpose: 'maskable any'
                    },
                    {
                        src: '/icons/icon-192x192.svg',
                        sizes: '192x192',
                        type: 'image/svg+xml',
                        purpose: 'maskable any'
                    },
                    {
                        src: '/icons/icon-384x384.svg',
                        sizes: '384x384',
                        type: 'image/svg+xml',
                        purpose: 'maskable any'
                    },
                    {
                        src: '/icons/icon-512x512.svg',
                        sizes: '512x512',
                        type: 'image/svg+xml',
                        purpose: 'maskable any'
                    }
                ],
            },
            workbox: {
                globPatterns: ['**/*.{js,css,html,ico,png,svg,woff2,json}'],
                runtimeCaching: [
                    {
                        urlPattern: /^https:\/\/.*\/api\/v1\/.*/,
                        handler: 'NetworkFirst',
                        options: {
                            cacheName: 'api-cache',
                            expiration: {
                                maxEntries: 100,
                                maxAgeSeconds: 86400
                            },
                            networkTimeoutSeconds: 10,
                            cacheableResponse: {
                                statuses: [0, 200]
                            }
                        }
                    },
                    {
                        urlPattern: /^https:\/\/.*\/storage\/.*/,
                        handler: 'CacheFirst',
                        options: {
                            cacheName: 'media-cache',
                            expiration: {
                                maxEntries: 50,
                                maxAgeSeconds: 604800
                            },
                            cacheableResponse: {
                                statuses: [0, 200]
                            }
                        }
                    },
                    {
                        urlPattern: ({ request }) => request.destination === 'document',
                        handler: 'NetworkFirst',
                        options: {
                            cacheName: 'pages-cache',
                            expiration: {
                                maxEntries: 50,
                                maxAgeSeconds: 86400
                            },
                            networkTimeoutSeconds: 10,
                            cacheableResponse: {
                                statuses: [0, 200]
                            }
                        }
                    }
                ],
                cleanupOutdatedCaches: true,
                clientsClaim: true,
                skipWaiting: true,
            },
        }),
    ],
});