How to config vite.config.ts for babel plugin in a MCV 6 application to transpile to ES5

Question

I am trying to use React Components in the same fashion as here, https://github.com/martijnboland/LeanAspNetCore-React.git, thus utilising vitejs serving up javascript to the ASP side.

So, the question is: Does anyone have suggestions for a good config? Or a sample-project maybe?

Maybe I have to do it differently with Durandal?

I have tried many different combinations in the config file (even used AI suggestions:-)). Maybe someone is out there with HI that beats AI?

The code is inserted into cs.html like this

<script type="module">
    import RefreshRuntime from '@Url.Content("~/dist/@react-refresh")'
    RefreshRuntime.injectIntoGlobalHook(window)
    window.$RefreshReg$ = () => {}
    window.$RefreshSig$ = () => (type) => type
    window.__vite_plugin_react_preamble_installed__ = true
</script>
<script type="module" src="~/dist/js/react-notes.tsx"></script>

which works nicely.

I am, however, using Durandal, with ES5, so I probably need to transpile code to make it work.

I tried using babel plugin for Vite (https://www.npmjs.com/package/vite-plugin-babel), but I cannot make it serve ES5 code. I guess it must be something missing or wrong in the vite.config.ts file.