vite-babel-plugin

const babel = require('@babel/core')

export default function babelPlugin() {
  const runtimePublicPath = '/@virtual-babel'

  return {
    name: 'vite-babel-plugin',
    resolveId(id) {
      if (id === runtimePublicPath) {
        return runtimePublicPath
      }
    },
    async transform(code, id, ssr) {
      if (ssr) return
      if (!id.endsWith('x') && !code.includes('react')) return
      if (code.includes('<!DOCTYPE html>')) return

      const plugins = []
      if (id.endsWith('.tsx')) {
        plugins.push(require('@emotion/babel-plugin'))
      }

      const parserPlugins = [
        'jsx',
        'importMeta',
        'topLevelAwait',
        'classProperties',
        'classPrivateProperties',
        'classPrivateMethods'
      ]
      if (/\.tsx?$/.test(id)) {
        parserPlugins.push('typescript', 'decorators-legacy')
      }

      const result = await babel.transformAsync(code, {
        plugins,
        babelrc: false,
        ast: true,
        sourceFileName: id,
        configFile: false,
        sourceMaps: true,
        parserOpts: {
          sourceType: 'module',
          allowAwaitOutsideFunction: true,
          plugins: parserPlugins
        },
      })
      return { code: result.code, map: result.map }
    }
  }
}