Internal server error: Failed to load url crypto

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

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

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
35/100
issue の種類
バグ
明瞭さ
説明が足りない
活発さ
停滞
技術スタック
node.js, react, typescript, vite
領域
devtools, tooling

調査の方向性

報告されている Node.js と Yarn のバージョンを使用し、パッケージを vite.config.ts に追加した後のリロード失敗を再現します。まず、SSR 中に node_modules/.vite/deps_ssr/react-router-devtools_client.js が crypto をどのように解決するかを調べます。開発サーバーが Vite の内部サーバーエラーなしでリロードできれば完了です。

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

説明

After installing this and adding it to my vite.config.ts, a reload results in:

...
[vite] Internal server error: Failed to load url crypto (resolved id: crypto) in  node_modules/.vite/deps_ssr/react-router-devtools_client.js. Does the file exist?
...
> node -v
v22.16.0
> yarn -v
4.9.1

> yarn info react-router               
└─ react-router@npm:7.6.2
   ├─ Instances: 1
   ├─ Version: 7.6.2
   │ 
   └─ Dependencies
      ├─ cookie@npm:^1.0.1 → npm:1.0.2
      └─ set-cookie-parser@npm:^2.6.0 → npm:2.7.1
> yarn info @react-router/dev
└─ @react-router/dev@npm:7.5.3
   ├─ Instances: 1
   ├─ Version: 7.5.3
   │ 
   ├─ Exported Binaries
   │  └─ react-router
   │ 
   └─ Dependencies
      ├─ @babel/core@npm:^7.21.8 → npm:7.27.4
      ├─ @babel/generator@npm:^7.21.5 → npm:7.27.5
      ├─ @babel/parser@npm:^7.21.8 → npm:7.27.5
      ├─ @babel/plugin-syntax-decorators@npm:^7.22.10 → npm:7.27.1
      ├─ @babel/plugin-syntax-jsx@npm:^7.21.4 → npm:7.27.1
      ├─ @babel/preset-typescript@npm:^7.21.5 → npm:7.27.1
      ├─ @babel/traverse@npm:^7.23.2 → npm:7.27.4
      ├─ @babel/types@npm:^7.22.5 → npm:7.27.6
      ├─ @npmcli/package-json@npm:^4.0.1 → npm:4.0.1
      ├─ @react-router/node@npm:7.5.3 → npm:7.5.3
      ├─ arg@npm:^5.0.1 → npm:5.0.2
      ├─ babel-dead-code-elimination@npm:^1.0.6 → npm:1.0.10
      ├─ chokidar@npm:^4.0.0 → npm:4.0.3
      ├─ dedent@npm:^1.5.3 → npm:1.6.0
      ├─ es-module-lexer@npm:^1.3.1 → npm:1.7.0
      ├─ exit-hook@npm:2.2.1 → npm:2.2.1
      ├─ fs-extra@npm:^10.0.0 → npm:10.1.0
      ├─ jsesc@npm:3.0.2 → npm:3.0.2
      ├─ lodash@npm:^4.17.21 → npm:4.17.21
      ├─ pathe@npm:^1.1.2 → npm:1.1.2
      ├─ picocolors@npm:^1.1.1 → npm:1.1.1
      ├─ prettier@npm:^2.7.1 → npm:2.8.8
      ├─ react-refresh@npm:^0.14.0 → npm:0.14.2
      ├─ semver@npm:^7.3.7 → npm:7.7.2
      ├─ set-cookie-parser@npm:^2.6.0 → npm:2.7.1
      ├─ valibot@npm:^0.41.0 → npm:0.41.0
      └─ vite-node@npm:3.0.0-beta.2 → npm:3.0.0-beta.2
x yarn info react-router-devtools
└─ react-router-devtools@npm:5.0.6
   ├─ Instances: 1
   ├─ Version: 5.0.6
   │ 
   └─ Dependencies
      ├─ @babel/core@npm:^7.26.10 → npm:7.27.4
      ├─ @babel/generator@npm:^7.26.5 → npm:7.27.5
      ├─ @babel/parser@npm:^7.26.10 → npm:7.27.5
      ├─ @babel/traverse@npm:^7.26.10 → npm:7.27.4
      ├─ @babel/types@npm:^7.26.10 → npm:7.27.6
      ├─ @biomejs/cli-darwin-arm64@npm:^1.9.4 → npm:1.9.4
      ├─ @radix-ui/react-accordion@npm:^1.2.2 → npm:1.2.11
      ├─ @radix-ui/react-select@npm:^2.1.5 → npm:2.2.5
      ├─ @rollup/rollup-darwin-arm64@npm:^4.32.1 → npm:4.42.0
      ├─ @rollup/rollup-linux-x64-gnu@npm:^4.32.1 → npm:4.42.0
      ├─ beautify@npm:^0.0.8 → npm:0.0.8
      ├─ bippy@npm:^0.3.7 → npm:0.3.16
      ├─ chalk@npm:^5.4.1 → npm:5.4.1
      ├─ clsx@npm:^2.1.1 → npm:2.1.1
      ├─ date-fns@npm:^4.1.0 → npm:4.1.0
      ├─ framer-motion@npm:^12.0.6 → npm:12.16.0
      ├─ react-d3-tree@npm:^3.6.4 → npm:3.6.6
      ├─ react-diff-viewer-continued@npm:^4.0.5 → npm:4.0.6
      ├─ react-hotkeys-hook@npm:^4.6.1 → npm:4.6.2
      ├─ react-tooltip@npm:^5.28.0 → npm:5.28.1
      └─ tailwind-merge@npm:^3.0.1 → npm:3.3.0
主要言語
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 を短くまとめたダイジェスト。