Vite Rubyを使っていたDockerで立ち上げた環境でHMRをしようと思いvite.config.tsでserver.hostをtrueにしてみたが、なぜかhostが変わらずハマったので解決方法をメモ📝
server.host サーバーがリッスンすべき IP アドレスを指定します。 0.0.0.0 もしくは true に設定すると、LAN やパブリックアドレスを含むすべてのアドレスをリッスンします。 https://ja.vitejs.dev/config/server-options#server-host
vite.config.tsでhostを指定しても変わらなかったのは、vite-plugin-railsでserver.hostをデフォルトでlocalhostにしており、上書きされてしまいvite.config.tsの設定が反映されなかったっぽい😭
"host": "localhost",const server: ServerOptions = { fs, host: config.host, https, port, strictPort: true }
公式ガイドでVITE_RUBY_HOSTを設定する必要があると書かれていた・・・！
Making HMR work in Docker Compose# Using Vite.js with Docker Compose requires configuring VITE_RUBY_HOST in the services. https://vite-ruby.netlify.app/guide/troubleshooting.html#making-hmr-work-in-docker-compose
サンプルも載っていたので見てみたところdocker-composeで別のサービスとして立ち上げるサンプルになっていたが、
個人的には、docker-composeで管理するサービスを増やさずjsbundling-railsみたいにforemanで同時に立ち上げたかったので、
docker-compose.ymlでRailsアプリケーションのサービスでVITE_RAILS_HOSTを0.0.0.0に設定し、portを3036をhostにforwardするようにして解決した🆗
ports:
- "3000:3000"
+ - "3036:3036"
environment:
+ VITE_RUBY_HOST: "0.0.0.0"
