import {defineConfig, PluginOption} from 'vite'
import {resolve} from 'path';
import {VitePWA} from 'vite-plugin-pwa';
import {visualizer} from "rollup-plugin-visualizer";
import react from '@vitejs/plugin-react'
import tailwindcss from '@tailwindcss/vite'

// https://vitejs.dev/config/
export default defineConfig(({mode}) => {
    const isProd = mode === 'production';
    return {
        server: {
            port: 3000,
            proxy: {
                '/api': {
                    target: 'http://localhost:8088',
                    changeOrigin: true,
                },
            },
        },
        plugins: [
            react(),
            tailwindcss(),
            ...(isProd ? [
                VitePWA({
                    registerType: 'autoUpdate',
                    workbox: {
                        maximumFileSizeToCacheInBytes: 10 * 1024 * 1024,
                        navigateFallbackDenylist: [/^\/api\//],
                        runtimeCaching: [
                            {
                                urlPattern: ({url}) => !url.pathname.startsWith('/api/'),
                                handler: 'NetworkOnly',
                            },
                        ],
                    },
                    includeAssets: ['favicon.ico', 'apple-touch-icon.png', 'mask-icon.svg'],
                    manifest: {
                        name: '{{.SystemName}}',
                        description: '',
                        background_color: '#313131',
                        icons: [
                            {
                                src: '/api/logo',
                                sizes: '512x512',
                                type: 'image/png',
                                purpose: "any"
                            },
                        ]
                    },
                })
            ] : [
                visualizer({}) as unknown as PluginOption
            ]),
        ],
        resolve: {
            alias: {'@': resolve(__dirname, './src')},
        },
        build: {
            sourcemap: false,
            minify: 'esbuild',
            target: 'es2020',
            chunkSizeWarningLimit: 2000,
            rollupOptions: {
                maxParallelFileOps: 2,
                output: {
                    manualChunks: {
                        react: ['react', 'react-dom'],
                        antd: ['antd', '@ant-design/pro-components'],
                        monaco: ['monaco-editor', '@monaco-editor/react'],
                        xterm: [
                            '@xterm/xterm',
                            '@xterm/addon-fit',
                            '@xterm/addon-search',
                            '@xterm/addon-canvas',
                            '@xterm/addon-webgl'
                        ],
                        charts: ['recharts']
                    }
                }
            }
        }
    }
});