farmcontrol-ui/vite.config.js

import react from '@vitejs/plugin-react'
import { defineConfig } from 'vite'
import eslintPlugin from 'vite-plugin-eslint'
import svgr from 'vite-plugin-svgr'
import svgo from 'vite-plugin-svgo'
import path from 'path'
import { fileURLToPath } from 'url'
import { visualizer } from 'rollup-plugin-visualizer'

const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(__filename)

const isCloudflare = process.env.VITE_DEPLOY_TARGET === 'cloudflare'

export default defineConfig({
  base: isCloudflare ? '/' : './', // Cloudflare Pages needs absolute paths; Electron needs relative for file://
  resolve: {
    alias: {
      three: path.resolve(__dirname, 'node_modules/three')
    }
  },
  optimizeDeps: {
    include: ['@ant-design/icons']
  },
  plugins: [
    react(),
    svgo(),
    svgr(),
    eslintPlugin(),
    visualizer(),
    // Transform index.html paths to absolute when building for Cloudflare Pages
    isCloudflare && {
      name: 'cloudflare-html-paths',
      transformIndexHtml(html) {
        return html
          .replace(/href="\.\//g, 'href="/')
          .replace(/src="\.\//g, 'src="/')
      }
    }
  ].filter(Boolean),
  build: {
    outDir: 'build',
    chunkSizeWarningLimit: 2000,
    rollupOptions: {
      output: {
        manualChunks(id) {
          // --- CodeMirror
          if (id.includes('node_modules/@codemirror')) {
            return 'codemirror'
          }

          // --- Lezer
          if (id.includes('node_modules/@lezer')) {
            return 'lezer'
          }

          // --- Core Vendor (Ant Design, React, etc.)
          if (
            id.includes('node_modules/antd') ||
            id.includes('node_modules/@ant-design') ||
            id.includes('node_modules/rc-') ||
            id.includes('node_modules/antd-style') ||
            id.includes('node_modules/@rc-component') ||
            id.includes('node_modules/dayjs') ||
            id.includes('node_modules/react') ||
            id.includes('node_modules/react-dom') ||
            id.includes('node_modules/react-router-dom')
          ) {
            // EXCLUDE charts so they are handled by lazy loading in HistoryDisplay.jsx
            if (
              id.includes('node_modules/@ant-design/charts') ||
              id.includes('node_modules/@ant-design/plots') ||
              id.includes('node_modules/@ant-design/graphs') ||
              id.includes('node_modules/@ant-design/charts-util') ||
              id.includes('node_modules/@antv')
            ) {
              return
            }
            return 'antd'
          }

          // --- Lodash
          if (id.includes('node_modules/lodash')) {
            return 'lodash'
          }

          // --- Three.js
          if (id.includes('node_modules/three')) {
            return 'three'
          }

          // --- GCode Preview
          if (id.includes('node_modules/gcode-preview')) {
            return 'gcode-preview'
          }

          // --- Online 3D Viewer
          if (id.includes('node_modules/online-3d-viewer')) {
            return 'online-3d-viewer'
          }

          // --- tsparticles
          if (
            id.includes('node_modules/@tsparticles') ||
            id.includes('node_modules/tsparticles')
          ) {
            return 'tsparticles'
          }
        }
      }
    }
  },
  server: {
    allowedHosts: ['dev.tombutcher.work'],
    host: '0.0.0.0',
    port: 5173,
    open: false
  }
})