claude code

frontend/vite.config.ts

@@ -0,0 +1,72 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+import path from 'path'
+
+// Documentation Vite : https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [
+    react({
+      // Support JSX automatique (pas besoin d'importer React)
+      jsxRuntime: 'automatic',
+    }),
+  ],
+
+  // Configuration des alias de chemins
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+      '@components': path.resolve(__dirname, './src/components'),
+      '@pages': path.resolve(__dirname, './src/pages'),
+      '@hooks': path.resolve(__dirname, './src/hooks'),
+      '@api': path.resolve(__dirname, './src/api'),
+      '@utils': path.resolve(__dirname, './src/utils'),
+      '@assets': path.resolve(__dirname, './src/assets'),
+      '@styles': path.resolve(__dirname, './src/styles'),
+    },
+  },
+
+  // Configuration du serveur de développement
+  server: {
+    host: '0.0.0.0', // Permet l'accès depuis l'extérieur du conteneur
+    port: 5173,
+    strictPort: true, // Échoue si le port est déjà utilisé
+    watch: {
+      // Utilise polling pour Docker (nécessaire pour hot-reload)
+      usePolling: true,
+    },
+    // Configuration CORS pour développement
+    cors: true,
+  },
+
+  // Configuration du build de production
+  build: {
+    outDir: 'dist',
+    sourcemap: true, // Génère les sourcemaps pour debugging
+    // Taille max des chunks (avertissement si dépassé)
+    chunkSizeWarningLimit: 1000,
+    rollupOptions: {
+      output: {
+        // Chunking manuel pour optimiser le cache
+        manualChunks: {
+          // Vendor chunks (dépendances externes)
+          'react-vendor': ['react', 'react-dom', 'react-router-dom'],
+          'query-vendor': ['@tanstack/react-query'],
+        },
+      },
+    },
+  },
+
+  // Variables d'environnement exposées au client
+  // Seules les variables préfixées par VITE_ sont exposées
+  envPrefix: 'VITE_',
+
+  // Configuration optimisations
+  optimizeDeps: {
+    include: [
+      'react',
+      'react-dom',
+      'react-router-dom',
+      '@tanstack/react-query',
+    ],
+  },
+})