PetAgent/frontend/vite.config.mjs

/**
 * Vite Configuration for AI Pet Companion Frontend
 * Sets up development server, build options, and plugin configurations
 */

import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve, dirname } from 'path'
import { fileURLToPath } from 'url'

const __dirname = dirname(fileURLToPath(import.meta.url))
const env = loadEnv(process.env.NODE_ENV || 'development', process.cwd(), '')

const proxyUrl = env.VITE_PROXY_TARGET || env.PROXY_URL || 'http://8.152.169.84:8001'
const serverPort = parseInt(env.VITE_SERVER_PORT) || 3000

function getPackageSubChunk(id, packageName, markers) {
  const packagePath = `node_modules/${packageName}/`
  const packageIndex = id.indexOf(packagePath)

  if (packageIndex === -1) {
    return null
  }

  const relativePath = id.slice(packageIndex + packagePath.length)

  for (const marker of markers) {
    const markerIndex = relativePath.indexOf(`${marker}/`)
    if (markerIndex === -1) {
      continue
    }

    const chunkName = relativePath
      .slice(markerIndex + marker.length + 1)
      .split('/')[0]
      .replace(/[^a-zA-Z0-9_-]/g, '')

    if (chunkName) {
      return chunkName.toLowerCase()
    }
  }

  return null
}

export default defineConfig({
  optimizeDeps: {
    include: ['vue', 'vue-router', 'pinia', 'element-plus', 'axios', '@vueuse/core']
  },
  plugins: [vue()],
  resolve: {
    alias: {
      '@': resolve(__dirname, 'src'),
    },
  },
  server: {
    host: '0.0.0.0',
    port: serverPort,
    open: false,
    cors: true,
    proxy: {
      '/api': {
        target: proxyUrl,
        changeOrigin: true,
        secure: false,
        ws: true,
      },
      '/uploads': {
        target: proxyUrl,
        changeOrigin: true,
        secure: false,
      },
      '/ws': {
        target: proxyUrl,
        ws: true,
        changeOrigin: true,
      }
    }
  },
  build: {
    outDir: 'dist',
    assetsDir: 'assets',
    sourcemap: false,
    minify: 'terser',
    chunkSizeWarningLimit: 1200,
    rollupOptions: {
      output: {
        manualChunks(id) {
          const echartsSubChunk = getPackageSubChunk(id, 'echarts', ['charts', 'components', 'renderers', 'coord', 'features'])
          if (echartsSubChunk) {
            return `charts-${echartsSubChunk}`
          }

          if (id.includes('node_modules/echarts')) {
            return 'charts'
          }

          const elementSubChunk = getPackageSubChunk(id, 'element-plus', ['es/components', 'lib/components'])
          if (elementSubChunk) {
            return `ui-${elementSubChunk}`
          }

          if (id.includes('node_modules/@element-plus/icons-vue')) {
            return 'icons'
          }

          if (id.includes('node_modules/element-plus')) {
            return 'ui'
          }

          if (id.includes('node_modules/axios') || id.includes('node_modules/@vueuse/core')) {
            return 'utils'
          }

          if (id.includes('node_modules/vue-router') || id.includes('node_modules/vue')) {
            return 'vendor'
          }

          return undefined
        }
      }
    }
  },
  css: {
    preprocessorOptions: {
      scss: {
        api: 'modern-compiler'
      }
    }
  }
})