shoc-frontend-new/vite.config.ts

import react from "@vitejs/plugin-react";
import tailwindcss from "@tailwindcss/vite";
import path from "node:path";
import { defineConfig, loadEnv, transformWithEsbuild } from "vite";
import { assertAbsoluteApiUrlHasApiSegment } from "./config/api-url-contract";

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

  assertAbsoluteApiUrlHasApiSegment(env.VITE_API_URL);

  return {
    plugins: [
      {
        name: "load-js-files-as-jsx",
        async transform(code, id) {
          if (!/\/src\/.*\.js$/.test(id)) {
            return null;
          }

          return transformWithEsbuild(code, id, {
            loader: "jsx",
            jsx: "automatic",
          });
        },
      },
      react(),
      tailwindcss(),
    ],
    optimizeDeps: {
      esbuildOptions: {
        loader: {
          ".js": "jsx",
        },
      },
    },
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "src"),
      },
    },
    server: {
      port: 3000,
      proxy: {
        "/api": {
          target: env.VITE_API_TARGET ?? "http://localhost:5141",
          changeOrigin: true,
          secure: false,
        },
      },
    },
    build: {
      outDir: "dist",
    },
  };
});