Files
igny8/frontend/vite.config.ts

111 lines
3.6 KiB
TypeScript

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import svgr from "vite-plugin-svgr";
import { resolve } from "path";
// https://vite.dev/config/
export default defineConfig(({ mode }) => {
const isDev = mode === "development";
const isMarketingBuild = mode === "marketing";
return {
plugins: [
react(),
svgr({
svgrOptions: {
icon: true,
// This will transform your SVG to a React component
exportType: "named",
namedExport: "ReactComponent",
},
}),
],
// Optimize dependency pre-bundling
optimizeDeps: {
include: [
// Only pre-bundle frequently used, small dependencies
"clsx",
"tailwind-merge",
"zustand",
// Include apexcharts for proper module resolution (skip during marketing-only build)
...(isMarketingBuild ? [] : ["apexcharts", "react-apexcharts"]),
],
// Exclude heavy dependencies that are only used in specific pages
// They will be lazy-loaded when needed
exclude: [
"@fullcalendar/core",
"@fullcalendar/daygrid",
"@fullcalendar/interaction",
"@fullcalendar/list",
"@fullcalendar/react",
"@fullcalendar/timegrid",
"@react-jvectormap/core",
"@react-jvectormap/world",
"react-dnd",
"react-dnd-html5-backend",
"swiper",
],
esbuildOptions: {
target: 'es2020',
},
},
// Build configuration for code splitting
build: {
// Enable minification (esbuild is faster than terser)
minify: 'esbuild',
// Enable CSS code splitting
cssCodeSplit: true,
// Optimize chunk size
rollupOptions: {
input: isMarketingBuild
? {
marketing: resolve(__dirname, "marketing.html"),
}
: {
main: resolve(__dirname, "index.html"),
marketing: resolve(__dirname, "marketing.html"),
},
output: {
// Optimize chunk file names
chunkFileNames: 'assets/js/[name]-[hash].js',
entryFileNames: 'assets/js/[name]-[hash].js',
assetFileNames: 'assets/[ext]/[name]-[hash].[ext]',
},
},
// Increase chunk size warning limit (default is 500kb)
chunkSizeWarningLimit: 600,
// Enable source maps in dev only
sourcemap: isDev,
// Report compressed sizes
reportCompressedSize: true,
},
// Only configure server and HMR in development mode
...(isDev && {
server: {
host: "0.0.0.0", // Allow external connections (for Docker)
port: isMarketingBuild ? 5174 : 5173, // Different port for marketing dev
strictPort: false, // Allow port fallback if port is busy
allowedHosts: [
"app.igny8.com",
"igny8.com",
"localhost",
"127.0.0.1",
],
watch: {
usePolling: true, // Needed for file watching in Docker
},
hmr: {
// Behind reverse proxy - use same origin strategy
// Client connects via public domain on default HTTPS port (443)
// Caddy automatically proxies WebSocket upgrades from 443 to dev port
protocol: "wss",
// Don't specify host/port - Vite will use same origin as page
// This ensures client connects to wss://domain.com (port 443 implicit)
},
// Increase timeout for slow connections and dependency pre-bundling
timeout: 120000, // 120 seconds (2 minutes) to match Caddy timeout
},
}),
};
});