ax-frontend-app/vite.config.ts

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

// https://vite.dev/config/
export default defineConfig({
  plugins: [react()],

  build: {
    // Enable minification for production builds (Req 13.9)
    // Vite 8+ uses oxc by default; 'esbuild' requires a separate install.
    // Leaving minify at its default ('oxc' in Vite 8) gives fast, aggressive
    // minification out of the box.
    // minify: 'esbuild',  // uncomment if esbuild is installed separately

    // Raise the warning threshold slightly – Ant Design + Slate are large
    // but are split into their own vendor chunk below.
    chunkSizeWarningLimit: 600,

    rollupOptions: {
      output: {
        /**
         * Manual chunk splitting (Req 13.8)
         *
         * Splitting large vendor libraries into dedicated chunks means the
         * browser can cache them independently of app code.  Tree-shaking
         * (built into Rollup by default) removes unused exports within each
         * chunk automatically (Req 13.9).
         *
         * Chunk strategy:
         *  - react-vendor  : React + React-DOM (stable, rarely changes)
         *  - antd-vendor   : Ant Design (large UI library, rarely changes)
         *  - slate-vendor  : Slate.js + slate-react + slate-history
         *  - utils-vendor  : Axios, Zustand, uuid (small but third-party)
         *  - app code      : everything under src/ (split by React.lazy)
         */
        manualChunks(id: string) {
          if (id.includes('node_modules/react') || id.includes('node_modules/react-dom')) {
            return 'react-vendor';
          }
          if (id.includes('node_modules/antd') || id.includes('node_modules/@ant-design')) {
            return 'antd-vendor';
          }
          if (
            id.includes('node_modules/slate') ||
            id.includes('node_modules/slate-react') ||
            id.includes('node_modules/slate-history')
          ) {
            return 'slate-vendor';
          }
          if (
            id.includes('node_modules/axios') ||
            id.includes('node_modules/zustand') ||
            id.includes('node_modules/uuid')
          ) {
            return 'utils-vendor';
          }
          // All other node_modules go into a generic vendor chunk
          if (id.includes('node_modules')) {
            return 'vendor';
          }
        },
      },
      // Rollup performs tree-shaking by default when building ES modules.
      // These options reinforce that unused exports are dropped (Req 13.9).
      treeshake: {
        moduleSideEffects: false,
        propertyReadSideEffects: false,
      },
    },
  },
});