Support direct imports of cljs in index.html

[brandonstubbs]

We could support direct imports of cljs files in the index.html.

This will allow them to specify a script tag like the following (Instead of the js file we have currently):

<script type="module" src="index.cljs"></script>

In order to support this we will need to plug into vite's transformindexhtml. We would write the code to rewrite the script tag to:

<script type="module" src="index.cljs.jsx"></script>

Then the rest of the plugin will work as usual.

It is not usual to see source files that the browser does not support in HTML. While this is possible, we need to decide if we want to support it as it's very vite specific, and the same index.html would not work if you switch tooling.

Official plugins like the one for vue does not support their custom extensions.

> npm create vite@latest
# choose the vue template

> cat index.html
...
<script type="module" src="/src/main.js"></script>
...

> cat src/main.js
import { createApp } from 'vue'
import './style.css'
import App from './App.vue'

createApp(App).mount('#app')

[brandonstubbs]

cc @borkdude @martinklepsch

[martinklepsch]

Thanks for logging this. Let's check in on this in a few weeks, although I almost think if Vue doesn't do this then maybe we shouldn't either.

It's kind of interesting though that .jsx will work... that wouldn't work in a browser either right?

Not sure I fully get Vite's restrictions in this situation...

[brandonstubbs]

The jsx would only work again in vites case, because they have a few extensions that they handle. I haven't tested this but I think any of these would work https://vitejs.dev/config/shared-options#resolve-extensions

Yeah definitely a tough call on this one