vite.config.mts

/// <reference types="vitest" />
import tailwindcss from '@tailwindcss/vite';
import vue from '@vitejs/plugin-vue';
import { resolve } from 'path';
import { visualizer } from 'rollup-plugin-visualizer';
import { defineConfig, loadEnv } from 'vite';
import { viteStaticCopy } from 'vite-plugin-static-copy';

const frontendDir = resolve(__dirname, 'src/main/frontend');
const outDir = resolve(__dirname, 'target/dist');

export default defineConfig(({ mode }) => {
  process.env = { ...process.env, ...loadEnv(mode, process.cwd()) };

  const isDevMode = process.env.NODE_ENV === 'development';
  const isTestMode = process.env.TEST === 'true';

  return {
    base: './',
    define: {
      __VUE_PROD_DEVTOOLS__: isDevMode,
      __PROJECT_VERSION__: JSON.stringify(
        `${process.env.PROJECT_VERSION || '0.0.0'}`,
      ),
    },
    plugins: [
      vue(),
      tailwindcss(),
      visualizer(() => {
        return {
          filename: resolve(__dirname, 'target/vite.bundle-size-analyzer.html'),
        };
      }),
      viteStaticCopy({
        targets: isTestMode
          ? []
          : [
              {
                src: ['sba-settings.js', 'assets/'],
                dest: outDir,
              },
            ],
      }),
    ],
    css: {
      preprocessorOptions: {
        scss: {
          api: 'modern-compiler',
        },
      },
    },
    test: {
      root: __dirname,
      globals: true,
      environment: 'happy-dom',  // Faster than jsdom (~2-3x)
      setupFiles: [resolve(frontendDir, 'tests/setup.ts')],
      env: {
        LANG: 'de_DE.UTF-8',
        LC_ALL: 'de_DE.UTF-8',
        TZ: 'Europe/Berlin',
      },
      include: ['**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
      maxWorkers: 4,
    },
    root: frontendDir,
    build: {
      target: 'es2022',
      outDir,
      rollupOptions: {
        input: {
          sba: resolve(frontendDir, './index.html'),
          login: resolve(frontendDir, './login.html'),
        },
        external: ['sba-settings.js', 'public/variables.css'],
      },
    },
    resolve: {
      alias: {
        '@': frontendDir,
      },
      extensions: ['.vue', '.js', '.json', '.ts'],
    },
    server: {
      proxy: {
        '^(/sba-settings.js|/variables.css)': {
          target: 'http://localhost:8080',
          changeOrigin: true,
        },
        '^/(applications|instances|notifications|extensions)(?:/.*)?$': {
          target: 'http://localhost:8080',
          changeOrigin: true,
          bypass: (req) => {
            const isEventStream = req.headers.accept === 'text/event-stream';
            const isAjaxCall =
              req.headers['x-requested-with'] === 'XMLHttpRequest';
            const isFile = req.url.indexOf('.js') !== -1;
            const redirectToIndex = !(isAjaxCall || isEventStream) && !isFile;
            if (redirectToIndex) {
              return '/index.html';
            }
          },
        },
      },
    },
  };
});