blackbox をなるべく少なくしつつ typescript や jsx を快適に使いたい。 jsx は html template として、とてもいいような気がしている。 vite を使うと自然に促進される esmodule もよい。

最初は vite + react + typescript でノーフレームワークだったのだけど、 blog の markdown 記事を変換する段階でやり方がわからなかった。 vite-plugin でできそうなものを探したのだが、その時はレベルが足リなくて頓挫してしまいました。フレームワークを使って解決することにした。 astro, minista, docusaurus, sveltekit を少しやって、実際にサイトに組みこんでみました。 next.js, vue.js はまだやってない。 あと、別件でちょっとだけ express とか websocket とかサーバー要素があるものと vite を組みあわせて使うのに四苦八苦していました。 express にライブラリーモードの vite を組みこんだりしていたのだけど、vite-plugin で完結させたいのです。

わりと慣れてきて、 viteimport.meta.glob とちょっとした vite-plugin を組み合わせればシンプルな仕組みで構成できそうな気がしてきました。 あるいは vite-plugin 自作できるのでは? sveltekit じゃなくて svelte もしくはフレームワーク無しの react でいいんでないか。

vite 調べる

ということで、vite そのものと rollup を調べ初めた。

いい記事発見。

https://trap.jp/post/1549/

https://trap.jp/post/1863/

レベル高いなーと思ったら、vite の contributer だった。 読む。

minista 読む

どのように vite を使っているのかソースを読んでみる。

https://github.com/qrac/minista/blob/main/packages/minista/src/cli/develop.ts#L42

vite をライブラリーモードで使うのではなく、 まとめて設定を追加して起動するスタイルだった。

https://github.com/qrac/minista/blob/main/packages/minista/src/cli/build.ts#L66

build も同様なのだけど、だいぶややこしい。