Babel-plugin-import plugin results in every component returning undefined

[anthonyma94]

Steps to reproduce

Steps:

1. Open this link to live example: https://stackblitz.com/edit/github-rga63amd?file=vite.config.ts
2. Let it run.

Current behavior

Following the docs here, I tried setting up bundle minimizing. However, every component becomes undefined.

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    react({
      babel: {
        plugins: [
          [
            'babel-plugin-import',
            {
              libraryName: '@mui/material',
              libraryDirectory: '',
              camel2DashComponentName: false,
            },
            'core',
          ],
          [
            'babel-plugin-import',
            {
              libraryName: '@mui/icons-material',
              libraryDirectory: '',
              camel2DashComponentName: false,
            },
            'icons',
          ],
        ],
      },
    }),
  ],
});

Uncaught ReferenceError: CssBaseline is not defined and so on.

Tested on v7.0.2, on both Firefox and Chrome.

Expected behavior

No response

Context

No response

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: babel, bundle, vite