I’m having a problem running my project in the environment, which gives me the error “TypeError: _jsxDEV is not a function”.

even leaving the component like this to test if it works, it still returns an error.

main.tsx code:

import '../src/styles/global.css'

import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'

import { ThemeProvider } from './theme/theme-provider'

createRoot(document.getElementById('root') as HTMLElement).render(
  <StrictMode>
    <ThemeProvider defaultTheme="dark" storageKey="vite-ui-theme">
      <div>test</div>
    </ThemeProvider>
  </StrictMode>,
)

in which my vite.config.js configuration is like that and I can’t see the problem:

export default defineConfig(({ mode }) => {
  return {
    plugins: [react()],
    root: '.',
    build: {
      outDir: path.resolve(__dirname, 'dist'),
      emptyOutDir: true,
      sourcemap: mode !== 'production',
      minify: 'terser',
      rollupOptions: {
        input: path.resolve(__dirname, 'index.html'),
        output: {
          manualChunks: (id) => {
            if (id.includes('node_modules')) {
              return 'vendor'
            }
          },
        },
      },
      terserOptions: {
        compress: {
          drop_console: true,
          pure_funcs: ['console.log', 'console.info'],
        },
      },
    },
    define: {
      'process.env.NODE_ENV': JSON.stringify(mode),
    },
    resolve: {
      alias: {
        '@': path.resolve(__dirname, './src'),
      },
    },
  }