🐳
Docker Desktop の 4.31.1 で、DevContainer上でViteを動かすと、ポートフォワードが動作しない
Docker Desktop for Windows の 4.31.1 (2024年6月29日現在の最新) にて、DevContainer上でViteのサーバーを起動した際に、ポートフォワードがうまく動きません。
コンテナの外からブラウザでアクセスしようとしたところ、アクセスできない(読み込み中のまま反応なし)状態になりました。
実際試したDevContainerは下記になります。(Remix のチュートリアルをDevContainerにしたもの)
問題があるバージョン
最新にする前は問題なく動作したので、どのバージョンから動作しないか確認しました。
- 4.31.1 : ×
- 4.31.0 : ×
- 4.30.0 : ×
- 4.29.0 : ○
4.30.0 で壊れたようです。
該当のIssue
DockerのIssueとしてあがっていました。Mac側でのIssueですが、Mac、Windowsどちらでも起こる問題のようです。
DevContainer、Vite側でもIssueが上がっています。
- [Windows+WSL2+Docker] Impossible to reach forwarded port from DevContainer · Issue #9893 · microsoft/vscode-remote-release
- Within a dev container using Docker 26, `vite dev` or `vite preview` cannot be accessed from the host · Issue #16522 · vitejs/vite
Docker側で、ホストがIPv4のみを使用している場合でも、::1
を返すようになったのが原因のようです。
ワークアラウンド
Viteの設定(vite.config)を変えることで回避できました。
export default defineConfig({
plugins: [
remix({
ignoredRouteFiles: ["**/*.css"],
}),
tsconfigPaths(),
],
+ server: {
+ host: '127.0.0.1'
+ },
});
Discussion