vite.config.ts

/**
 * vite.config.ts
 * 
 * Purpose:
 * Configures the Vite build system for the FitFlow application, providing optimized development
 * and production build settings. This configuration ensures fast development experience, 
 * efficient dependency handling, and optimized production output for the React application.
 * 
 * Key Features:
 * - React plugin integration for JSX transformation and HMR
 * - Dependency optimization with strategic inclusion/exclusion
 * - CommonJS module transformation for seamless integration
 * - Module deduplication to prevent duplicate React instances
 * - Path aliasing for simplified imports and AWS SDK compatibility
 * 
 * Technical Details:
 * - Configures React plugin for JSX/TSX transformation and Fast Refresh
 * - Pre-bundles common dependencies for faster development startup
 * - Excludes Lucide React from pre-bundling to prevent optimization issues
 * - Handles mixed ESM/CommonJS modules with transformMixedEsModules
 * - Deduplicates React to prevent "invalid hook call" errors
 * - Provides AWS SDK compatibility through runtime config aliasing
 * 
 * Integration:
 * - Entry point for the Vite build process
 * - Referenced during npm scripts (dev, build, preview)
 * - Configures bundling behavior for all application assets
 * - Works alongside TypeScript and PostCSS configurations
 * - Enables HMR for development efficiency
 * 
 * Recent Changes:
 * - 2025-03-01: Added comprehensive documentation following project standards
 */

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [react()],
  optimizeDeps: {
    include: ['react', 'react-dom', 'react-router-dom', '@supabase/supabase-js', 'lodash'],
    exclude: ['lucide-react']
  },
  build: {
    commonjsOptions: {
      include: [/node_modules/],
      transformMixedEsModules: true
    }
  },
  resolve: {
    dedupe: ['react', 'react-dom'],
    alias: {
      './runtimeConfig': './runtimeConfig.browser'
    }
  }
});