coding 實驗了一下 vite + handlebars，感覺可以

GitHub - alexlafroscia/vite-plugin-handlebars: Vite ...

這陣子研究輕量級開發，做了很多嘗試，現在感覺 DOM 交互，以及響應式狀態的最佳解決方案應該是走 petite-vue

但只要不上標準的 SPA App 那套虛擬 DOM 架構，基本做不到 html 拆分

而模板引擎剛好可以補上這個缺口，借助模板引擎的力量就可以對 .html 的 template 進行拆分了，總覺得理論上 CSS modules 或許也插得進去，這就要再研究研究了

不過這基本上是要走 html 預處理了，勢必還是得上 build tool，不過上 build tool 之後，確實比無編譯環境要舒服很多，解決了拆分太多模塊造成 request 數增加的缺點，同時也可以做 minify 甚至是 gzip，更好的壓小檔案

最重要的時候，上 Server 之後，那個路由問題，無編譯環境很麻煩......
例如本機開發，路徑是 "/"
但 Server 卻是，"/page-a/aaa/bbb/"
這種情況就很煩

為了兼顧開發環境 Live Server 跑得起來，產品環境也沒問題，就得手動用 js 判斷，去換 path 的頭。如果 user 關 js，或是 js 下載太慢、啟動太慢等等，首屏渲染瞬間會看到畫面出現破綻

這是上 build tool 完全不會有的問題，設置也方便很多

目前我的策略是，核心的 lib 都用 CDN 拉，不裝在 npm 上。vite 純粹用來打包跟編譯 public path，然後透過 handlebars 拆分一下 html

狀態，DOM 的交互那些，就交給 petite-vue 處理，handlebars 純做為拆分輔助用

這樣的配置 build 出來的檔案依舊很小，會比無 build 環境更小 (有打包跟 minify)。而開發環境也不會像 Vue App、React App 那麼肥

而這種客製化打包配置，Vite 就比 webpack 產生壓倒性優勢了，我基本就用 vite 開個香草 ts 專案，幾乎 0 設定就可以完成上述配置

如果是用 webpack 所有東西都要手動配置，可預期會比用 Vite 多花個好幾倍的時間成本