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

export default defineConfig({
  plugins: [react()],
  
  resolve: {
    alias: {
      '@': '/src',
      '@shared': path.resolve(__dirname, '../shared'),
    },
  },
  
  build: {
    outDir: '../assets/dist/frontend',
    emptyOutDir: true,
    
    rollupOptions: {
      input: 'src/index.tsx',
      output: {
        // Single file output
        format: 'iife',
        entryFileNames: 'boostbot-widget.js',
        assetFileNames: 'boostbot-widget.[ext]',
        // No code splitting for widget
        manualChunks: undefined,
      },
      // Tree-shaking optimization
      treeshake: {
        moduleSideEffects: false,
        propertyReadSideEffects: false,
      },
    },
    
    // Use terser for better minification
    minify: 'terser',
    terserOptions: {
      compress: {
        drop_debugger: true,    // Remove debugger statements
        pure_funcs: ['console.log', 'console.debug'], // Preserve console.info and console.warn for diagnostics
        passes: 2,              // Run compression twice for better results
      },
      mangle: {
        safari10: true,         // Safari 10 compatibility
      },
      format: {
        comments: false,        // Remove all comments
      },
    },
    
    // Generate manifest for WordPress
    manifest: true,
    
    // Don't inline assets - generate separate CSS file
    assetsInlineLimit: 0,
    
    // Ensure CSS is extracted and minified
    cssCodeSplit: false,
    cssMinify: true,
    
    // Target modern browsers (reduces polyfills)
    target: 'es2020',
    
    // Report compressed size
    reportCompressedSize: true,
  },
  
  // Optimize dependencies
  optimizeDeps: {
    include: ['react', 'react-dom', 'framer-motion', 'zustand'],
  },
  
  define: {
    'process.env.NODE_ENV': JSON.stringify('production'),
  },
});
