react-starter/vite.config.ts at main · parajs/react-starter · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
import { loadEnv, type UserConfig } from 'vite'
import react from '@vitejs/plugin-react'
// import react from '@vitejs/plugin-react-swc'
import { fileURLToPath, URL } from 'node:url'
import tailwindcss from '@tailwindcss/vite'
import { visualizer } from 'rollup-plugin-visualizer'
import svgr from "vite-plugin-svgr";


// https://vite.dev/config/


interface ConfigEnv {
  command: 'build' | 'serve'
  mode: string
  isSsrBuild: boolean
  isPreview: boolean
}

export default function defineProject({ command, mode, isSsrBuild, isPreview }: ConfigEnv): UserConfig {
  console.log('command:', command)
  console.log('mode:', mode)
  console.log('isSsrBuild:', isSsrBuild)
  console.log('isPreview:',  isPreview)
  const env = loadEnv(mode as string, process.cwd())
  console.log('env %O ', env)
  const { VITE_API_PREFIX, VITE_BASE_URL } = env

  return {
        plugins: [
        react(
          // {
          //    babel: {
          //       plugins: [['babel-plugin-react-compiler']],
          //   },
          // }
        ),
        tailwindcss(),
        svgr(),
        visualizer(),
      ],
      server: {
          proxy: {
            [VITE_API_PREFIX]: {
              target: VITE_BASE_URL,
              changeOrigin: true,
              // rewrite: (path) => path.replace(/^\/api/, '')
            }
          }
      },
      build: {
          rollupOptions: {
            output: {
              manualChunks: {
                react: ["react", "react-dom"],
                reactRouter: ["react-router"],
                reactQuery: ["@tanstack/react-query", "@tanstack/react-query-devtools"],
                i18n: ["react-i18next", "i18next", "i18next-http-backend", "i18next-browser-languagedetector"],
                reactUse: ["react-use"],
                ui: [
                  "@radix-ui/react-slot",
                  "class-variance-authority",
                  "clsx",
                  "tailwind-merge",
                ],
              },
            },
          },
      },
      resolve: {
          alias: {
            '@': fileURLToPath(new URL('./src', import.meta.url))
          }
        }
}}