import { defineConfig, transformWithEsbuild } from 'vite';
import react from '@vitejs/plugin-react';
import tailwindcss from '@tailwindcss/vite';
import path from 'path';
import { fileURLToPath } from 'url';

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

export default defineConfig({
  // 若为 true，esbuild 会对 Tailwind 误生成的 gri 等无效规则告警；可改回 true 并接受提示
  build: { cssMinify: false },
  plugins: [
    // Allow JSX in .js files (all files under src/)
    {
      name: 'treat-js-as-jsx',
      async transform(code, id) {
        if (!id.match(/\/src\/.*\.js$/)) return null;
        return transformWithEsbuild(code, id, { loader: 'jsx' });
      },
    },
    react({ include: '**/*.{jsx,js}' }),
    tailwindcss(),
  ],
  resolve: {
    alias: { '@': path.resolve(__dirname, './src') },
  },
  base: '/',
  server: { port: 3000 },
  optimizeDeps: {
    esbuildOptions: {
      loader: { '.js': 'jsx' },
    },
  },
});