Vite 03 設定とプラグイン

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import tailwindcss from '@tailwindcss/vite'
import path from 'node:path'
 
export default defineConfig({
  plugins: [react(), tailwindcss()],
  resolve: {
    alias: { '@': path.resolve(__dirname, './src') },   // import '@/components/...'
  },
  server: {
    port: 3000,
    open: true,
    proxy: {
      // 開発中、/api へのリクエストをバックエンドへ転送(CORS 回避)
      '/api': {
        target: 'http://localhost:8787',
        changeOrigin: true,
      },
    },
  },
  build: {
    outDir: 'dist',
    sourcemap: true,
  },
})

{ "compilerOptions": { "paths": { "@/*": ["./src/*"] } } }

export default defineConfig(({ command, mode }) => {
  if (command === 'serve') {
    return { /* 開発用 */ }
  }
  return { /* ビルド用 */ }
})

npm add -D @vitejs/plugin-react