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 })