/ frontend / vite.config.ts
vite.config.ts
 1  import { defineConfig } from 'vite'
 2  import react from '@vitejs/plugin-react'
 3  import { resolve } from 'path'
 4  import { existsSync } from 'fs'
 5  
 6  // Check if local acdc-design exists for development HMR
 7  const localDesignPath = resolve(__dirname, '../../acdc-design/src')
 8  const localDesignExists = existsSync(localDesignPath)
 9  
10  export default defineConfig(({ command }) => {
11    // Only use local alias in serve mode (dev server), not during build
12    // This avoids CSS processing issues with @apply in acdc-design source
13    const useLocalDesign = command === 'serve' && localDesignExists
14  
15    return {
16    plugins: [react()],
17    server: {
18      port: 3000,
19      proxy: {
20        '/api': {
21          target: 'http://localhost:8000',
22          changeOrigin: true,
23        },
24      },
25      watch: useLocalDesign ? {
26        // Watch linked acdc-design package for changes
27        ignored: ['!**/node_modules/@acdc/design/**'],
28      } : undefined,
29      fs: {
30        // Allow serving files from acdc-design directory for HMR
31        allow: ['..', '../../acdc-design'],
32      },
33    },
34    optimizeDeps: {
35      // Force include the linked package so Vite processes it
36      include: ['@acdc/design'],
37      // Force re-optimization when acdc-design changes
38      exclude: [],
39    },
40    resolve: useLocalDesign ? {
41      alias: {
42        // Direct alias to source for HMR during development (only if local path exists)
43        '@acdc/design': localDesignPath,
44      },
45    } : undefined,
46    build: {
47      outDir: 'dist',
48      sourcemap: true,
49    },
50    }
51  })