Port conflict (EADDRINUSE) when running typegen and dev server simultaneously

オープン
#243 コメント 1 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
45/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
停滞
技術スタック
react, typescript, vite
領域
devtools

調査の方向性

ソースファイルもテストも指定されていません。まず、dev server と typegen entry points で共有されている DevTools の初期化をたどり、次に記載されている環境変数とプロセス引数を調べてください。pnpm dev と型生成コマンドを同時に実行しても EADDRINUSE エラーが発生せず、通常の DevTools の動作が維持されれば完了です。

索引モデルが issue の本文から書いたものです。

説明

Port conflict (EADDRINUSE) when running typegen and dev server simultaneously

Context

I'm using React Router DevTools with type generation tools (react-router typegen, safe-routes typegen).

Reproduction

When running type generation tools and the development server simultaneously, both try to bind to port 42069 (used by TanStack DevTools), resulting in an EADDRINUSE error.

Steps to Reproduce
# Terminal 1: Start dev server
pnpm dev

# Terminal 2: Run type generation
pnpm typegen
# or
react-router typegen
Error Message
Error: listen EADDRINUSE: address already in use :::42069

System Info

  • OS: macOS 14.6.0 (Darwin 24.6.0)
  • Node: v20.x
  • Package Manager: pnpm 10.18.0
  • react-router-devtools: 6.0.1
  • @tanstack/devtools: 5.x
  • Vite: 6.3.6

Used Package Manager

pnpm

Expected Behavior

Type generation tools and the dev server should be able to run simultaneously without port conflicts. The DevTools should automatically disable itself when running in a type generation context.

Actual Behavior

The second process fails to start due to port 42069 already being in use by TanStack DevTools, which is initialized by both the dev server and type generation process.

Possible Solution

Detect type generation context (via environment variables like TYPEGEN_RUNNING=1 or command-line arguments) and disable DevTools initialization when running type generation, preventing unnecessary port binding.

Implementation approach:

  • Check for typegen indicators: TYPEGEN_RUNNING=1, SAFE_ROUTES_TYPEGEN=1, process.argv includes "typegen"
  • Return empty plugin array when in typegen context
  • Maintain backward compatibility for normal dev mode
主要言語
TypeScript
スター
975
フォーク
55
PR マージ指標
30日以内にマージされた PR はありません

環境構築

  • Dockerfile・Docker Compose ファイルなし
  • プルリクエストのテンプレートあり
  • コントリビューションガイドなし

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

code-forge-io/react-router-devtools のほかの issue

code-forge-io/react-router-devtools の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。