Hey!

just wanted to share these conventions before we make a first release to NPM, I think vite-plugin-squint would adhere to their conventions.

I think technically this might also be a rollup plugin (vite is a superset of rollup in terms of their plugin API) but I don't have a strong opinion on that. Will explore the differences a bit more and report back.

I don't fully grasp the details yet but I found this code from a haxe vite plugin. Could be that's all thats needed:

https://github.com/ciscoheat/vite-plugin-haxe/blob/2cb147281285ca533b1d21da625718538db5d7a5/src/index.ts#L42-L54

    handleHotUpdate(event) {
      let files: string[];
      if (event.file.endsWith(".hx")) files = Array.from(hxmlFiles.keys());
      else if (!event.file.endsWith(".hxml")) files = [event.file];
      else return;

      files.forEach((hxml) => {
        const module = event.server.moduleGraph.getModuleById(hxml);
        if (module) {
          event.server.reloadModule(module);
        }
      });
    },

As we link to the root projects in the demos package.json

"vite-plugin-squint": "file:../.."

It seems that if you have not run npm i in the root project, npm won't resolve linked project dependencies automatically. Thus on a fresh checkout and going into a demo and running npm i npm run dev you get dependency errors on the dependencies the plugin is using.

I am not sure how to solve this with file linking?

cc: @borkdude @martinklepsch

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')

Tailwind recompiles classes on changes to .js files, but not for .cljs files. Any ideas on why this happens?

In the case of https://github.com/nextjournal/clojure-mode, which is a library, I use squint (+ watch) to compile .cljs files into .mjs files. These .mjs files can then be directly used from other projects, like described here:

https://github.com/nextjournal/clojure-mode?tab=readme-ov-file#use-it-from-npm

How does one do that with this plugin, would every downstream user of a project which relies on this plugin, need this plugin?

Once we are happy with things we need to test this on windows to make sure the file paths don't cause any issues

It would be great to have a small example with React usage.

• Use @vitejs/plugin-react
• Write a small react app that demonstrates local state persisting over refreshes